Angular 子模块中的多条路由

Question

如果我有一个 Angular 模块，这些路线

const routes: Routes = [
  {path: 'route1', children: [
    {path: '', component: route1Component}
  ]},
  {path: 'route2', children: [
    {path: '', component: route2Component}
  ]},
  {path: 'route3', children: [
    {path: '', component: route3Component}
  ]}
];

然后我如何使用父模块中的路由，我会在其中延迟加载。 通常我会做这样的事情

{path: 'route1', loadChildren: () => import('../child.module').then(m => m.ChildModule)}

但这通常意味着子路由有默认路由，这里我有 3

我只想导入模块，并从该模块获取所有路由

Answer 1

您必须为延迟加载的路由器提供任何一个默认路由。 所以我建议只定义默认路由器并将其重定向到第一条路由。

所以你可以有以下代码：

const routes: Routes = [
 {path:''',redirectTo:'route1',pathMatch:'full'},
  {path: 'route1', children: [
    {path: '', component: route1Component}
  ]},
  {path: 'route2', children: [
    {path: '', component: route2Component}
  ]},
  {path: 'route3', children: [
    {path: '', component: route3Component}
  ]}
];

这将解决您未定义任何默认路由器的问题。