Angular

Angular 2Activatedrouteパラメーターがサービス内または外部で機能しない



Angular 2 Activatedroute Params Not Working Service



解決：

ルーターによって追加されたコンポーネントは、ルーターセグメントを取得します（ActivatedRoute）は合格しましたが、サービスにはアクティブ化されたルートがありません。 router.eventsにサブスクライブし、ルートツリー（router.firstChild ... `）をトラバースして、必要な特定のルートシーケンスからパラメーターを取得できます。

https://github.com/angular/angular/issues/11023も参照してください




これを行うAngularサービスは次のとおりです。

'@ angular / core'から{Injectable}をインポートします。 import {ActivatedRoute、NavigationEnd、NavigationExtras、ParamMap、Router} from '@ angular / router'; 'nativescript-angular / router'から{RouterExtensions}をインポートします。 import {NavigationOptions} from'nativescript-angular / router / ns-location-strategy '; 'rxjs / Observable'から{Observable}をインポートします。 'rxjs / operator / first'から{first}をインポートします。 'rxjs / operator / filter'から{filter}をインポートします。 'rxjs / operator / map'から{map}をインポートします。 'rxjs / operator / switchMap'から{switchMap}をインポートします。 import {unRegisterAndroidOnBack} from '../../ utils / view.utils'; @Injectable（）export class RoutingService {コンストラクター（プライベートrouterExtensions：RouterExtensions、プライベートルート：ActivatedRoute、プライベートルーター：ルーター）{} public getActivatedRouteParameter（paramName：string）：Observable {return this.router.events.pipe（filter（e = > e instanceof NavigationEnd）、map（（）：ActivatedRoute => {let route = this.route; while（route.firstChild）{route = route.firstChild;} return route;}）、filter（（route：ActivatedRoute）= > route.outlet === 'primary'）、switchMap（（route：ActivatedRoute）=> route.paramMap）、first（））; }
。
 
 
  
私はウェブ上で簡単な解決策を探していましたが、ついにAngular8で機能するものを見つけました。
 
https://medium.com/@eng.ohadb/how-to-get-route-path-parameters-in-an-angular-service-1965afe1470e
 
これは期待どおりに機能します。 Web上で利用可能な多くの異なるフレーバーがあります。しかし、これだけが私のために働いた。私はrxjsとオブザーバーの配管に慣れていないので、チェーンが長くなるとすぐに混乱します。
 
 
 
エクスポートクラスMyParamsAwareService {コンストラクター（プライベートルーター：ルーター）{this.router.events .pipe（filter（e =>（e instanceof ActivationEnd）&&（Object.keys（e.snapshot.params）.length> 0））、map （e => e instanceof ActivationEnd？e.snapshot.params：{}））。subscribe（params => {console.log（params）; //ここでやりたいことを何でもします!!!!}）; }}
明らかにその後、あなたはあなたが望むようにあなたのサービスを設計することができます。パラメータをインターフェースするため。