导入模块中的Angular 2路径会覆盖当前电流 [英] Angular 2 routes in imported module override current

问题描述

这是笨蛋: https://plnkr.co/edit/WIFNVIEVqls4gXk21Muj

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

There're 2 modules both have routes defined. Module 2 imports module 1 in order to use a component from it. You can never navigate to Module 2. Module 1 loads instead.

模块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' }
];

谢谢.

推荐答案

要解决此问题，有两个问题.首先，路由器存在一个错误，该错误考虑了导入模块的顺序.有关该错误的更多详细信息，请参见以下错误报告: https://github.com/angular/angular/issues/12648

Two issues to get this working. First, there is a bug with the router that takes in account the order of your imported modules. For more details on the error, see this bug report: https://github.com/angular/angular/issues/12648

因此，要解决该错误，您需要在module2.module.ts中更改导入顺序，以便在导入module1之前先导入module2路由文件.

So to get around the bug, you need to change the order of your imports in module2.module.ts so that your module2 routing file is imported before you import module1.

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

第二，不要使用ModuleWithProviders将路由模块导出为const，而是将其导出为类. aka更改module2路由文件(module2.routing.ts)来像这样导出一个类(您需要导入NgModule):

Second, instead of exporting your routing module as a const using ModuleWithProviders export it as a class. aka change the module2 routing file (module2.routing.ts) to export a class like so (you'll need to import NgModule):

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

这应该为您解决.这是个工作正常的人: https://plnkr.co/edit/5impstull9EBCUxlw26k

This should fix it for you. Here's a working plunker: https://plnkr.co/edit/5impstull9EBCUxlw26k

这篇关于导入模块中的Angular 2路径会覆盖当前电流的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！