角路径未触发

Question

我的网站有类似的路线：

https://example.com/boat/categories/name-3

我定义了这样的路线：

    const routes: Routes = [
      {
        path: '',
        component: LayoutBoxComponent,
        children: [
          {
            path: '',
            component: HomeComponent
          },
          {
            path: 'posts/:slug',
            component: PostComponent
          },
          {
            path: ':site_name',
            component: HomeComponent,
            children: [
              {
                path: 'categories/:by_category',
                component: CategoryComponent    <==== This component does not seems to triggered
              }
            ]
          }
        ]
      }
    ]

当尝试访问路由https://example.com/boat/categories/name-3时，CategoryComponent不会被调用，我似乎不知道为什么。想法？

编辑

在我的例子中：

https://example.com/boat/categories/name-3

与此模式相匹配：

https://example.com/:site_name/categories/:by_category

这里的boat是动态的。也可能是car或train

Answer 1

要访问子路由，需要在父路由中使用<router-outlet>。

因此，要访问CategoryComponent，您需要LayoutBoxComponent和HomeComponent在它们的html文件中有一个<router-outlet></router-outlet>。

Stackblitz示例 -可以通过将路由设置为：https://angular-ivy-b4kdcc.stackblitz.io/test/categories/x来测试