Question

该应用程序位于此处：https://angular-dqpbqa.stackblitz.io。我在做什么错？并且它最初还会加载heroes-list，但路径为。

功能模块的延迟加载无法正常工作。我已经在每个功能模块中创建了单独的路由。使用loadchildren属性动态加载模块

const routes: Routes = [
{ path: 'dashboard',
  loadChildren: () => import('./dashboard/dashboard.module').then(mod => 
mod.DashboardModule)
},
 { path: 'heroes',
  loadChildren: () => import('./heroes/heroes.module').then(mod => 
mod.HeroesModule)
},
{ path: 'detail/:id',
  loadChildren: () => import('./hero-detail/hero-detail.module').then(mod 
=> mod.HeroDetailModule)
},
{
path: '',
redirectTo: '',
pathMatch: 'full'
},

];

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

stackblitz可编辑：https://stackblitz.com/edit/angular-dqpbqa

Answer 1

HeroesModule不是延迟加载的，因为它是在app.module.ts中导入的，<=就是错误

@NgModule({
  imports: [ /* ... */ HeroesModule, /* ... */ ]
})
export class AppModule { }

在那里，HeroesModule最初已加载，并且该应用可以访问heroes-routing.module.ts的路由

因此，当您导航到''时，该路径将与''中定义的显示heroes-routing.module.ts的路径HeroesComponent匹配

延迟加载功能模块-Angular

1 个答案: