导航到兄弟儿童路由器插座不工作
问题描述:
这是我的路由组件。基本上我路由的出口到html标签导航到兄弟儿童路由器插座不工作
目前我在交易页面 - > TransactionsComponent选项卡(单个)。
<a [routerLink]="['../Product',{outlets :{ }}]"></a>
我不知道什么如何应该是routerlink上方导航到FridgeComponent - >“冰箱”直接出口。我尝试了不同的选择,都没有工作。
请建议实现此目的的方式。
export const ROUTES: Routes = [
{ path: '', redirectTo:'home', pathMatch: 'full'},
{ path: 'home', component: HomeComponent,
children:[
{
path :'',
component: HomeOneComponent,
outlet:'one'},
{
path :'',
component: HomeTwoComponent,
outlet:'two'
}
]},
{
path: 'Product',
component: ProductComponent,
children:[
{path :'', component: TVComponent, outlet:'tv'},
{path :'', component: ACComponent, outlet:'ac'},
{path :'', component: FridgeComponent, outlet:'fridge'}
]
},
{
path: 'Transactions',
component: TransactionsComponent
}
];
答
这应该为你工作,你必须在你的路由的值赋给路径,即使是孩子的路线。
.........
{
path: 'Product',
component: ProductComponent,
children:[
{path :'tv', component: TVComponent, outlet:'tv'},
{path :'ac', component: ACComponent, outlet:'ac'},
{path :'fridge', component: FridgeComponent, outlet:'fridge'}
]
},
........
而在HTML routerLink,确保ü提出口名称和路径名
<a [routerLink]="['/product', {outlets: {'fridge': ['fridge']}}]">
</a>
如果你仍然看到困难,请分享Github上/ plunker。
提供路径值将工作。但我不想显示每个组件的路径。由于孩子们是标签的一部分。有没有提供路径的方式? – Sanjaybxl