angular - 子路由参数不可用

Question

这是我第二次在 Angular 路由器中遇到一些奇怪的事情。我目前正在使用 Angular v4.3.1。

我使用相同的组件来创建和编辑对象。这就是我想为这个组件定义两条路由的原因，一条有 id，另一条没有。

我试图创建以下路线：

{
    path: 'company/settings/survey',
    component: SurveyComponent,
    children:[
      {path:':id',
      component:SurveyComponent
      }
    ]
}

但在这种情况下，我的 id 参数永远不会设置。

我正在检索它：

  this.route.paramMap.subscribe((params) => {
    if (params.has('id')) {
        //Some stuff
    }
  }

我目前正在使用故障回复：

  {
    path: 'company/settings/survey',
    component: SurveyComponent,
  }, {
    path:'company/settings/survey/:id',
    component: SurveyComponent
  }

但我想了解我的第一个解决方案不起作用的原因。

谢谢你的帮助 ！

Answer 1

尝试这个：

{
    path: 'company/settings/survey',
    children:[
      {
          path:'',  component:SurveyComponent
      },
      {
          path:':id',  component:SurveyComponent
      },
    ]
}

然后

constructor(route: ActivatedRouteSnapshot) {}
this.route.paramMap.get('id');
.......

Answer 2

在您的第一个示例中，您的代码将尝试路由到另一个 SurveyComponent 中的 SurveyComponent，我认为这不是您打算做的。

子路由被加载到<router-outlet>父组件中