使用延迟加载以角度获取路线参数

Question

我会从 Angular 5 的路由路径中检索一个参数

http://localhost:4200/#/dashboard/74618/LastCC

我会 74618从路由这是一个id参数。

我是这样处理的

constructor(public activatedRoute: ActivatedRoute)


this.activatedRoute.paramMap.subscribe(params => {
  console.log("params******");
  params.get("id");
});

我得到undefined作为价值。

当我在这条路上时它正在工作http://localhost:4200/#/dashboard/74618/ （没有\LastCC）

LastCC 是延迟加载的，这里是路由器配置：

const routes: Routes = [
  {
    path: "",
    component: CreditPointComponent
  }
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class CreditPointRoutingModule {}

id 参数位于父模块路由器配置（仪表板模块）上。

const routes: Routes = [
  {
    path: ":id",
    component: DashboardComponent,
    children: [
      {
        path: "LastCC",
        loadChildren:
          "app/useful-documents/credit-point/credit-point.module#CreditPointModule"
      }
    ]
  }
];

Answer 1

您没有在LastCC路由上配置参数。尝试这样的事情：

  {
    path: ":id",
    component: DashboardComponent
  },
  {
     path: ":id/LastCC",
     loadChildren:
          "app/useful-documents/credit-point/credit-point.module#CreditPointModule"
   }

请注意，LastCC 路由的路径现在有一个路由参数： path: ":id/LastCC"

另请注意，LastCC 路由不再是子路由。有必要吗？

如果它确实需要是子路由，那么您可能需要保留路由配置，并从父路由而不是从LastCC路由中读取参数。

this.activatedRoute.parent.paramMap.subscribe(params => {
  console.log("params******");
  console.log(params.get("id"));
});

注意.parent之后的activatedRoute。