了解功能模块上的角形布线

Question

我在app-routing.module.ts

中定义了路由

[
   {path: 'xyz', loadChildren: './child/child.module#ChildModule'}
]

，在child-routing.module.ts中，

[
    {path: '', component: ChildComponent},
    {path: ':id', component: ChildComponent}
]

当我访问路线localhost:4200/xyz时，它会加载预期的ChildComponent。

但是当我转到localhost:4200/时，它会加载ChildComponent。这不是预期的，因为我认为它是parent_route，即xyz加上child_route。

如何限制角度加载ChildComponent上的/

示例发布在StackBlitz https://stackblitz.com/edit/angular-xts7bc

上

Answer 1

您正尝试lazy-load和ParentModule的{​​{1}}，但是您已经分别将它们导入了ChildModule和AppModule中。路由器与Parent和AppModule中定义的路由不匹配，但它们与ChildModule匹配，因此即使在根（'/'）上也可以获取该组件。

要解决此问题，请从ParentModule的导入数组中删除ParentModule，然后从AppModule的导入中删除ChildModule。