Question

这是羽毛球：https://plnkr.co/edit/WIFNVIEVqls4gXk21Muj

有2个模块都定义了路由。模块2导入模块1以便使用其中的组件。您永远无法导航到模块2.而是加载模块1。

模块1路由：

const routes: Routes = [
  { path: '', component: Module1Component }
];

模块2路由：

const routes: Routes = [
  { path: '', component: Module2Component }
];

应用路由：

const routes: Routes = [
  { path: 'module1', loadChildren: 'app/module1/module1.module#Module1Module' },
  { path: 'module2', loadChildren: 'app/module2/module2.module#Module2Module' }
];

谢谢。

Answer 1

使这项工作有两个问题。首先，路由器存在一个错误，它会考虑导入模块的顺序。有关错误的更多详细信息，请参阅此错误报告：https://github.com/angular/angular/issues/12648

因此，为了解决这个问题，您需要在module2.module.ts中更改导入的顺序，以便在导入module1之前导入module2路由文件。

@NgModule({
    imports: [
        routing, // this order is important
        Module1Module
    ],
    declarations: [
        Module2Component
    ]
})

其次，使用ModuleWithProviders将路由模块导出为const，而不是将其导出为类。又更改module2路由文件（module2.routing.ts）以导出类似的类（你需要导入NgModule）：

@NgModule({
    imports: [RouterModule.forChild(routes)],
    exports: [RouterModule]
})
export class routing {
}

这应该为你解决。这是一个工作的掠夺者：https://plnkr.co/edit/5impstull9EBCUxlw26k

导入模块中的Angular 2路由覆盖当前

1 个答案: