1

我的一个模块中有一个嵌套路由对象，其中包含用于子路由的路由器插座：

const routes: Routes = [
    {
      path: 'portal',
      component: Portal
    },
      children: [
        { path: '', redirectTo: 'meetings', pathMatch: 'full' },
        { path: 'meetings', component: MeetingsListComponent,
          children: [
            { path: '', redirectTo: 'points', pathMatch: 'full' },
            { path: 'points', component: PointsListComponent},
            { path: 'point/:id', component: PointComponent}
          ] 
        }
      ]
    }
];

MeetingsListComponent 有一个带有星期几的选项卡菜单，并且对于每一天，它都将会议列表呈现为手风琴元素。如果用户打开手风琴，MeetingsListComponent 的嵌套路由器出口将议程点列表呈现为数据表：PointsListComponent。如果用户点击数据行，PointComponent 应该以一个议程点的详细视图呈现：

onRowClick(e) {
    this.router.navigate(['../point', e.value.obj.id], {relativeTo: this.route});
}

发生以下情况：浏览器中的 url-path 从 切换：

http://localhost:4200/portal/meetings/points

至

http://localhost:4200/portal/meetings/point/24fc3f42-7898-4044-9e24-511460d2001d

哪个是对的。

但奇怪的是，PointComponent 只是“有时”呈现。如果我单击菜单选项卡并且今天或明天更改了数据集，则会呈现数据表，但是通过单击行，URL 会更改，而 PointComponent 不会在路由器插座中呈现。

但是，如果我在选项卡菜单中转到某天，单击同一组件（可数据行）会呈现详细视图，即路由器插座中的 PointComponent。没有什么不同，就是同一个组件填充了其他数据，仅此而已。

因此，路由器导航事件似乎正常工作，但路由器插座没有这样做：

这是一个关于路由错误的简短视频

我需要深入了解这个问题。

4

0 回答 0