1
ある これは、これは私のルートの定義であるルータ・コンセントの角度2 routerStateコンセントが、私はプライマリルータ・コンセントと補助ルータ-oultetでアプリを持って常にプライマリ
<div>
<!-- links to primary outlet -->
<a routerLink="/">left 1</a><br>
<a routerLink="/left2">left 2</a><br>
<!-- links to right outlet -->
<a [routerLink]="[{outlets:{right:'right1'}}]">right 1</a><br>
<a [routerLink]="[{outlets:{right:'right2'}}]">right 2</a><br>
<a [routerLink]="[{outlets:{right:null}}]">clear right</a><br>
</div>
<div style="width:48%;float:left;border:1px solid red;margin-top:20px;padding:2px;">
<h2>Primary Outlet</h2><hr/>
<router-outlet></router-outlet>
</div>
<div style="width:48%;float:right;border:1px solid green;margin-top:20px;padding:2px;">
<h2>Right Outlet</h2><hr/>
<router-outlet name="right"></router-outlet>
</div>
両方と私のテンプレートです
RouterModule.forRoot([
{
path : "",
component : Left1
},
{
path : "left2",
component : Left2
},
{
path : "right1",
outlet:'right',
component : Right1
},
{
path : "right2",
outlet:'right',
component : Right2
}
]
router.events
にリスナーを添付しました。どのコンセントが現在のナビゲーションを処理しているか知りたいと思います。
export class App {
private evtSub;
constructor(router:Router){
this.evtSub = router.events.subscribe(e=>{
//I assume this would log the current routes outlet, but it always logs 'primary'
console.log("router.routerState.root.outlet is::", router.routerState.root.outlet);
if(e instanceof RoutesRecognized){
//this would sure log the current route since we are on the route event, but still no luck
console.log("RoutesRecognized outlet is ::",e.state.root.outlet);
}
})
}
}
問題はrouterState.root.outlet
は(私は子コンポーネントで、モジュールに聞きしようとしましたが、私はいつも同じ動作を得る)現在のルートが
「正しい」の場合でも、常に「主」であるということですここで
はあなたが現在のルートに耳を傾けるActivatedRouteを使用することができます上記の動作とplunker https://plnkr.co/edit/csIWByyMSziTaAgmhTuC?p=preview
右、そしてそれはいつも「右」で、一次コンセントでルーティングするときでさえ、どのコンセントがそれに影響を与えるかをナビゲーションで知る方法はありますか? – yoelp
チェックに追加して、「主」と表示されます
– Sanket上記plunker – yoelp