可以在Angular 8中预加载延迟加载的模块吗？

Question

我知道当一个应用程序有很多零件和组件时，最好将它们分成延迟加载的模块，这样用户就可以快速看到应用程序主页。

事情是我注意到导航到延迟加载模块的组件显示用户交互（单击按钮/菜单）和显示组件（与非延迟加载组件比较）之间的一些延迟。

有没有办法手动预加载延迟加载的模块？ 所以假设用户看到主屏幕，如果在3秒内没有完成任务，那么在后台加载我的一些关键应用模块。

Answer 1

通过使用PreloadAllModules设置data: { preload: true }而不是所有模块，您可以仅为一个模块使用preload策略。

{
  path: 'crisis-center',
  loadChildren: () => import('./crisis-center/crisis-center.module').then(mod => mod.CrisisCenterModule),
  data: { preload: true }
},

Answer 2

是的，你可以使用preloadingStrategy

你必须像这样添加它：

RouterModule.forRoot(appRoutes, {preloadingStrategy : PreloadAllModules } )

例：

import { RouterModule, Routes, PreloadAllModules } from '@angular/router';

const appRoutes: Routes = [
  { path: 'employees', loadChildren: './employee/employee.module#EmployeeModule' },
  { path: 'home', component: HomeComponent },
  { path: '', redirectTo: '/home', pathMatch: 'full' },
  { path: '**', component: PageNotFoundComponent }
];

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

这是一篇很好的文章