Question

我正在尝试'插入'包含路由配置（从RouterModule.forChild()导入）的子ngModule（功能模块）到父ngModule中。

使用延迟加载时，使用父模块路由配置中的loadChildren键完成指定“插入”子模块的位置。

例如：

export const parentModuleRouteConfig = [{
    path: 'myfeaturemodule',
    loadChildren: '/app/child.module'
}];

实际上，我不想使用延迟加载。

我如何告诉路由器“插入”（或使用）给定路径上子模块中指定的路由配置？

Answer 1

使用AOT

导出您的子路线，而不是将它们添加到您的子模块。

export const ChildRoutes: Routes = [
    { path: '', component: ChildComponent }
];

将子模块导入父模块并直接包含路由。

const parentModuleRouteConfig: [{
    path: 'myfeaturemodule',
    // loadChildren: () => ChildModule
    children: ChildRoutes
}];

@NgModule({
    imports: [
        ChildModule
    ]
})
export class ParentModule { }

没有AOT

您仍然可以使用loadChildren同步加载。有一些例子in this github issue。

import { ChildModule } from '/app/child.module';

export const parentModuleRouteConfig = [{
    path: 'myfeaturemodule',
    loadChildren: () => ChildModule
}];

Answer 2

您可以定义预加载策略，告诉Angular预加载所有模块：

import { ...., PreloadAllModules } from '@angular/router'

@NgModule({
  ....
  imports: [
         RouterModule.forRoot(arrayOfYourRoutes, { preloadingStrategy: PreloadAllModules })
  ]

如果您只想预加载某些模块，也可以定义自定义策略。要获得这样做的好方法，请查看：example in angular doc

在您发表评论后进行编辑，自我描述您的模块，这里有您可以做的事情：

@NgModule(
   imports: [RouterModule.forChild(routesOfFeatureModule)], //use forChild instead of forRoot
   exports: [RouterModule]
)
export class MyFeatureRoutingModule{} //define routing in a separate module of your feature, everything related to routing go there. This way, you doen't polute your main FeatureModule file. Re-export RouterModule to be able to use router directives in your FeatureModule just by importing MyFeatureRoutingModule


@NgModule(
   ...
   imports: [MyFeatureRoutingModule] //import routing of your feature module
)
export class MyFeatureModule{}



@NgModule(
   ...
   imports: [MyFeatureModule] // import your feature module
)
export class AppModule{}

Angular2：没有延迟加载

2 个答案:

使用AOT

没有AOT