1

好的所以为了简单起见，假设我有 3 个组件：一个父组件和两个其他组件（子 A 和子 B）。

我希望父组件具有 '/parent' 的 url 前缀并包含其他两个组件之一，默认为组件 A，否则 B，它们分别具有自己的 url 前缀“childA”和“childB”。此外，我不希望父组件本身可见，它必须具有 childA 或 childB 可见，如果调用“/parent”，它将自动重新路由到“/parent/childA”。

到目前为止，这是我的路由器中的内容，但它无法正常工作当我路由到“/parent”和路由到“/parent/child[AorB]”时，我在控制台上收到无效路径错误，我的浏览器滞后永远永远不会路由：

{
  path: 'parent', component: ParentComponent,
  children : [
    {
      path: '',
      redirectTo: 'childA' 
    },
    {
      path: 'childA',
          component: ChildAComponent
    }, {
      path: 'childB',
      component: childBComponent
    }
  ]
}

父母的模板只是一个路由器插座，如下所示：

<router-outlet></router-outlet>
4

2 回答 2

1

需要像这样添加pathMatch: 'full' ：

{
  path: 'parent', component: ParentComponent,
  children : [
    {
      path: '',
      redirectTo: 'childA',
      pathMatch: 'full' //<--------- Need this here
    },
    {
      path: 'childA',
          component: ChildAComponent
    }, {
      path: 'childB',
      component: childBComponent
    }
  ]
}
于 2018-03-16T06:44:11.203 回答
0

确保您在 html 中定义了 2 个路由器插座，因此 angular 会知道哪个是父级，哪个是子级..

您的链接代码如何？对于孩子，使用“./”，如下所示：

[routerLink]="['./childA']"

家长可以直接去...

[routerLink]="['parent']"
于 2018-09-17T08:50:29.040 回答