我们的棱角分明4.3.6应用程序具有延迟加载的模块,例如车队,维护,汽车等 .

我的顶级应用程序路由器如下所示:

const routes: Routes = [
  { path: '', redirectTo: 'fleet', pathMatch: 'full' },
  {
    path: '',
    component: AppComponent,
    canActivate: [AuthenticationGuard],
    children: [
      {
        path: 'fleet',
        loadChildren: "./modules/fleet.module",
        canActivate: [AuthenticationGuard]
      },
      {
        path: 'car/:id',
        loadChildren: "./modules/car.module",
        canActivate: [AuthenticationGuard]
      },
      {
        path: 'maintenanceProgram',
        loadChildren: "./modules/maintenanceProgram.module",
        canActivate: [AuthenticationGuard]
      }
}

我们确实有一个共享模块,其中包含在整个应用程序中使用的通用组件(我们有很多组件) . 但是,有一些组件,如模态,只能由 MaintenanceProgramCar 模块共享,但不能在其他任何地方使用 .

为了保持共享模块的合理性,我只在 MaintenanceProgram 模块中包含这些曾经重用的组件,导出它们,并将 MaintenanceProgram 模块导入 Car 模块以访问导出的组件 .

CarMaintenanceProgram 模块在各自的 @NgModule.imports[] 中调用了以下嵌入子路径:

汽车:

const CarModuleRoutes = RouterModule.forChild([
  {
    path: '',
    component: CarComponent,
    canActivate: [AuthenticationGuard]
  },
  {
    path: ':id',
    component: CarComponent,
    canActivate: [AuthenticationGuard]
  }
]);

和维护计划:

const MaintenanceProgramModuleRoutes = RouterModule.forChild([
  {
    path: '',
    component: MaintenanceProgramComponent,
    canActivate: [AuthenticationGuard]
  }
]);

这显然也不是正确的方法

  • 到子路由,或

  • 到模块转换

because when I load the Car route, I get the Maintenance Program's default route .

我试过了:

  • CarModule@NgModule.imports[] 中更改 MaintenanceProgramModuleRoutesCarModuleRoutes 的导入顺序,

  • 从CarModule中删除空路径 .

是唯一的解决方案是创建另一个包含没有路由器的共享组件的共享模块,还是有另一种更优雅的方法来做到这一点?

这是一个简化的例子,我们实际上有许多路由和数百个组件,只能重复使用两次或三次 . 随着应用程序的增长,这个问题肯定会持续到未来,因此我需要一个可扩展且可维护的解决方案 . 创建数十个或更多额外的共享模块是不可行的 .