angular - 在你的模块中使用另一个模块 : imports vs. 在路由中使用 loadChildren

Question

在我对 Angular 的探索中，我发现了两种在另一个模块中使用一个模块的可能方法。

(引用angular-express-starter project)

• 方法一:在 imports 数组中声明它。 For example

  @NgModule({
    declarations: [
      AppComponent
    ],
    imports: [
      BrowserModule,
      SharedModule,
      FormsModule
    ]
  })
  

• 方法二:在路由中使用 loadChildren。 For example :

  export const routes: Route[] = [
    { path: '', pathMatch: 'full', redirectTo: 'weather'},
    { loadChildren: 'app/dashboard/dashboard.module#DashboardModule', path: 'dashboard' },
    { loadChildren: 'app/profile/profile.module#ProfileModule', path: 'profile' },
    { loadChildren: 'app/weather/weather.module#WeatherModule', path: 'weather' }
  ];
  

这两种方法之间的实际区别是什么？

Answer 1

What are the practical differences between these two methods?

最大的区别是通过 loadChildren 加载的模块将有自己的注入(inject)器，而来自导入模块的提供者被合并到一个根注入(inject)器中。这意味着您不能将延迟加载模块中的提供程序注入(inject)到其他延迟加载模块中。

其他区别:

• 如果不使用路由就不能使用loadChildren
• 通过loadChildren加载的模块只有在对应的路由导航到
时才会加载

阅读更多信息

• Avoiding common confusions with modules in Angular