为什么Angular 6组件未在延迟加载的模块中路由

Question

数小时后，经过许多重构，我不明白为什么延迟加载的路由模块中的路径未按预期运行。

示意上，我在应用程序的顶部有一个路由模块，该模块加载仪表板模块：

  ...
  {
    path: 'dashboard',
    loadChildren: '@app/dashboard/dashboard.module#DashboardModule',
    canActivate: [AuthGuardService]
  },
  ...

DashboardModule导入DashBoardRoutingModule，其定义为：

const routes: Routes = [
  {
    path: '', component: DashboardComponent,
    canActivate: [AuthGuardService],
    children: [
      {path: 'shops', component: ShopListComponent}
    ]
  }
];

我希望http：// localhost / dashboard / shops会加载ShopListComponent，但...根本不会...

我阅读了一些与此行为相关的文章，但即使该组件本身也未位于模块内部，或者...演示仅限于一条路线...

我想念什么？ 检查了我所有的进口和报关...

谢谢

Answer 1

在hello组件中，您正在尝试执行以下操作：

<a routerLink="/shops">Boutiques</a>

路径应为：

<a routerLink="/dashboard/shops">Boutiques</a>

Answer 2

我们发现问题是延迟加载的模块中缺少<router-outlet></router-outlet> 。