Question

我正在通过以下链接进行实验。 https://angular.io/guide/router#the-sample-application

如您所见，进行路由有几个里程碑。在遵循这些里程碑的过程中，我遇到了一些错误。 https://angular.io/guide/router#child-route-configuration 在此步骤上，我无法继续，因为第二条路线无效。

const crisisCenterRoutes: Routes = [
  {
    path: 'crisis-center',
    component: CrisisCenterComponent,
    children: [
      {
        path: '',
        component: CrisisListComponent,
        children: [
          {
            path: ':id',
            component: CrisisDetailComponent
          },
          {
            path: '',
            component: CrisisCenterHomeComponent
          }
        ]
      }
    ]
  }
];

第二条路线目前无法正常工作。

https://github.com/Js-Guru321/angular-router-sample 这是我的代码。

请帮助我！

Answer 1

将<router-outlet>添加到crisis-list.html，一切正常嵌套路由的每个级别都需要在父路由内使用自己的router-outlet标签

<ul class="crises">
  <li *ngFor="let crisis of crises$ | async" [routerLink]="['/crisis-center', crisis.id]"
    [class.selected]="crisis.id === selectedId">
      <span class="badge">{{ crisis.id }}</span>{{ crisis.name }}
  </li>
</ul>
<router-outlet></router-outlet>

角度6秒嵌套子路线无效

1 个答案: