Angular 5 在模块内定义子路由答案

【问题标题】：Angular 5 defining child routes inside modulesAngular 5 在模块内定义子路由
【发布时间】：2018-01-24 23:08:14
【问题描述】：

我的 Angular 5 应用程序具有以下结构：

/-app module
   /--- settings dashboard component
/-settings A module
   /--- list A component
   /--- edit A component
/-settings B module
   /--- list B component
   /--- edit B component

我想为此模块和组件设置路由：

'settings' -> settings dashboard component (defined in app-routing.module.ts)
'settings/A' -> list A component (defined in a-routing.module.ts)
'settings/A/edit' -> list A edit component (defined in a-routing.module.ts)
'settings/B' -> list B component (defined in b-routing-module.ts)
'settings/B/edit' -> list B edit component (defined in b-routing-module.ts)

有可能吗？我尝试将路线与孩子组合，但它不起作用。

【问题讨论】：

您能否更具体地说明您当前面临的问题是什么以及您要解决什么问题？也可能包括您的路由设置会有所帮助。
是的，有可能。我在这里有一个路由示例可能会有所帮助：github.com/DeborahK/MovieHunter-routing

标签： angular angular2-routing angular5

【解决方案1】：

好的，我明白你的担忧，但是是的，这是可能的。

app-routing.module

const routes: Routes = [{
  path: 'settings',
  component: SettingsDashboardComponent
}, {
  path: 'settings/A',
  loadChildren: './a/a.module#AModule'
}, {
  path: 'settings/B',
  loadChildren: './b/b.module#BModule'
}];

a-routing.module

const routes: Routes = [{
  path: '',
  component: AListComponent
}, {
  path: 'edit',
  component: AEditComponent
}];

b-routing 就像 a-routing。

路由包含另一个路由的一部分这一事实并不重要，它适用于完全匹配。它确实关心延迟加载的部分，但仅限于它可以匹配延迟加载路由中某处的完整路由。

【讨论】：