angular - 有没有办法动态插入 ngx 面包屑而不使模块成为某个父模块的子模块？

Question

我们有一个体育预订网站，我想作为面包屑如下：

:home/:sport/:city/:court

:home,:sport并且:/city都被路由到HomeComponent. 但是，当:court提供 a 时，用户应该被路由到CourtComponent，如下面的代码片段所示：

const routes: Routes = [
  
  {
    path: ':city',
    component: HomeComponent,
  },
  {
    path: ':city/:court',
    component: CourtComponent,
  },
  { path: '', component: HomeComponent },
];

但是，这会导致:city/:court路径被视为单个 url，这意味着用户无法单击:city并被路由到:home/:sport/:city.

我知道我可以制作CourtComponent一个孩子HomeComponent，但是添加一个额外的并在激活时router-outlet隐藏似乎过于复杂。HomeComponentCourtComponent

:city有没有更简单的方法可以在面包屑之前插入单独的面包:court屑？

任何建议将不胜感激！

标签： angularxng-breadcrumb