Angular 使用RouterLink的角度主路线和命名路线导航

在经历了很多痛苦之后，我终于成功了：

this.router.navigateByUrl（“/live chat（subnav:subnav）”）
但我似乎无法用
[routerLink]=''
指令重现这一点

目标是导航到顶级页面，并将左侧subnav设置为特定组件

应用程序组件布局：

<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>

这似乎是可行的，即通过引用“primary”导航“primary”/“un-named”路由器：


现场聊天
联络

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

<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>