在我的角度模块路由中,我有一个包含子组件的父组件作为tabitems .
路由:
{
path: "teacher/:id", component: TeacherTabcontrolComponent,
children: [
{ path: 'dialogue', component: TeacherTabpageDialoguesComponent, data: { title: 'Dialoge' } },
{ path: 'settlements', component: TeacherTabpageSettlementsComponent, data: { title: 'Settlements' } },
{ path: 'timesheets', component: TeacherTabpageTimesheetsComponent, data: { title: 'Timesheets' } },
{ path: 'transactions', component: TeacherTabpageTransactionsComponent, data: { title: 'Transactions' } },
]
},
TeacherTabcontrolComponent
中的选项卡式控件:
<ul class="nav nav-tabs">
<li routerLinkActive="active"><a [routerLink]="['dialogue']">Dialogue</a></li>
<li routerLinkActive="active"><a [routerLink]="['transactions']">Transactions</a></li>
<li routerLinkActive="active"><a [routerLink]="['settlements']">Settlements</a></li>
<li routerLinkActive="active"><a [routerLink]="['timesheets']">Timesheets</a></li>
</ul>
<div class="tab-content">
<router-outlet></router-outlet>
</div>
在父组件 TeacherTabcontrolComponent
中,我需要从路由访问数据{title:...} . 我在我的.ts代码中尝试了以下内容:
constructor(
private _route: ActivatedRoute,
) {
this._route.url.subscribe((e) => {
console.log(e, this._route.snapshot.firstChild.data);
});
}
这很好用,但仅在第一次输入父组件时才有效 . 当我从一个孩子切换到另一个孩子时,没有事件被触发 .
如何从一个孩子导航到另一个孩子时收到通知?
1 回答
您可以在父组件中订阅
router.events
. 因此,在每个路由更改时,您可以获取路由的子数据 .