2017-10-25 33 views
2

角型ルータの変更点は、遅くても私はこれについてどうやって行くのか分かりません。親コンポーネントから子コンポーネントへparamを取得

私はアドレスバーにある「イベントID」と呼ばれる私の親コンポーネント上のparamを持っている:それは値です。この場合、

http://localhost:4200/event/1 

は、私は、ルーティングでそれを宣言する方法をここで1

ありますコンポーネント:

{ path: 'event/:eventId', loadChildren: './event/event.module#EventModule', canActivate: [AuthGuard] }, 

だから私は道ダウンラインである子コンポーネントを持っています

私の購入計画コンポーネントでは、どのようにイベントIDを取得できますか?

私が試してみた:

import { ActivatedRoute } from '@angular/router'; 
export class PurchasePlansComponent implements OnInit { 
    eventId: number; 
    constructor(private activatedRoute: ActivatedRoute) { 
    this.subscription = activatedRoute.parent.params.subscribe(
     (param: any) => { 
     this.eventId = param['eventId']; 
     } 
    ); 
    } 
    ngOnInit() { 
    alert(this.eventId); 
    } 
} 

しかし、これだけ作品を、私はこのレベルでだ場合:

http://localhost:4200/event/1/event-home 

しかし、私はこのレベルでだならば、それは動作しません。

http://localhost:4200/event/1/event-travel-agents/purchase-plans 
+0

は(現時点でテストすることが、ちょうどあなたのアイデアを与えることができない)あなたのような何かを試してみました: 'activatedRoute.snapshot.parent.params [ 'eventId'] '? –

+0

[共有サービス](https://rahulrsingh09.github.io/AngularConcepts/faq)に行くのではなく、同じコンポーネントを扱っているときに動作しなければならないと感じたらエラーです。 –

+0

@deezgスナップショットを使用すると、パラメータが動的に変更されるシナリオでは機能しません。変更をサブスクライブする必要があります –

答えて

0

ご協力いただきありがとうございます。 答えは非常に長かったです。サブスクリプションなしで行れました:今、あなたの問題のためにあなたを助けることができるparamsInheritanceStrategyの新機能がある角5.2リリースでは

this.eventId = this.activatedRoute.parent.snapshot.parent.params.eventId; 
0

。それは、ルータが親から子へのparams、データおよび解決のデータをマージする方法を定義し

@NgModule({ 
    import :[RouterModule.forRoot(router,{paramsInheritanceStrategy :'always'})] 
}) 

を以下のよう

あなたはそれを使用することができます

利用可能なオプションは次のとおりです。

1。emptyOnly:デフォルトののみ常にheritsパスレスやコンポーネントレス

2.の親のparamsを:は、親のparamsの無条件の継承を可能にします。次のようにあなたがそれを使用することができるコンポーネントで

constructor(private route: ActivatedRoute) {} 

ngOnInit() { 
    this.eventId = +this.route.snapshot.paramMap.get("eventId"); 
    } 
関連する問題