Angular 6 路由器丢失路由参数

Question

我在使用 Angular 6 的路由时遇到一些意外行为。给定一个主应用程序和延迟加载模块，我可以成功访问 domain/base/name，但是所有推荐的访问路由参数的方法都为空。

//  Main routing module
const routes: Routes = [
  {
    path: '', component: LayoutComponent, children: [
      { path: 'base', loadChildren: 'baseModule' },
    ]
  }
];

----
----

//  Lazy loaded router module
const routes: Routes = [
  {
    path: '', component: BaseComponent, children: [
      { path: ':name', component: ChildComponent }
    ]
  }
];

----
----

  //    Base Component
  this.route.paramMap.subscribe(params => {
    this.foo = params.get('name');
    console.log(this.foo);
  });

给定这些代码块，this.foo 总是出现为空。我是否以某种方式错误配置或误解了这条路线？

Answer 1

你的路线参数即 { path: ':name', component: ChildComponent }, 会打开子组件，因此访问路由参数的代码应该在ChildComponent而不是BaseComponent中。

Angular 6 路由器丢失路由参数

Angular 6 router loses route params

angular-routing

angular