使用RouterLink进行角度主路线和命名路线导航

Question

在经历了很多痛苦之后，我开始工作：this.router.navigateByUrl('/live-chat(subnav:subnav)');但我似乎无法用[routerLink]=''指令来重现这一点。

目标是导航到顶级页面，并将左侧的sub-v设置为特定组件。

应用程序组件布局：

<div class="main-container">
<router-outlet name="alerts"></router-outlet>
<app-nav-menu></app-nav-menu>
<div class="content-container">
<router-outlet name="subnav"></router-outlet>
<div class="content-area">
<router-outlet></router-outlet>
</div>
</div>
</div>

路由器设置：

RouterModule.forRoot([
{ path: '', component: HomeComponent, pathMatch: 'full' },
{ path: 'live-chat', component: LiveChatComponent },
{ path: 'subnav', component: SubnavComponent, outlet: 'subnav' },
]),

Answer 1

这似乎很有效，即导航"初级"/"未命名的"；路由器；主"：

<a class="nav-link nav-text" 
[routerLink]="[{ outlets: { primary: ['live-chat'], subnav: ['subnav'] } } ]">
Live Chat</a>
<a class="nav-link nav-text"
[routerLink]="[{ outlets: { primary: ['contacts'], subnav: ['contacts-list'] } }]">
Contacts</a>