我想拥有多个路由模块,以保持我的应用程序清洁和易于阅读.我目前使用延迟加载SubComponent,但我不想这样做.所以我正在寻找一种方法来改变它.无论如何,这是目前正在运行的代码.
我有以下两个路由文件.
APP-routing.module.ts：
import { NgModule } from '@angular/core';
import { Routes,RouterModule } from '@angular/router';
const routes: Routes = [
{ path: '',component: HomeComponent },{ path: 'sub',loadChildren: './sub/sub.module#SubModule' }
];
@NgModule({
imports: [RouterModule.forRoot(routes)],exports: [RouterModule]
})
子routing.module.ts：
import { NgModule } from '@angular/core';
import { Routes,component: SubComponent,children: [
{ path: 'new',component: SubEditComponent }
] },];
@NgModule({
imports: [RouterModule.forChild(routes)],exports: [RouterModule]
})
它的工作方式很好,但我不想对这个SubComponent应用延迟加载.所以,理想情况下我想将app-routing.module.ts更改为：
import { NgModule } from '@angular/core';
import { Routes,component: SubComponent }
];
@NgModule({
imports: [RouterModule.forRoot(routes)],exports: [RouterModule]
})
这将不起作用,并导致以下错误：
ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'sub/new' Error: Cannot match any routes. URL Segment: 'sub/new'
SubComponent的大小会大幅增加,我不想因为自己的原因而应用延迟加载.所以无论如何,有没有办法在避免延迟加载的同时使用多个路由文件？
解决方法
您是否尝试过这样加载：
{path：’sub’,loadChildren :()=>子模块}
你可以找到更多细节here.
