尝试使用 forRoot() 为延迟加载的组件延迟加载与 Angular Material 相关的自定义模块不起作用

Question

我通过 angular-routing 设置了一个延迟加载模块，我正在使用angular-material包来渲染数据。 按照建议，我为名为MaterialModule的forRoot -components 创建了一个自定义模块（使用forRoot方法）我将它导入到app-module作为 forRoot ： MaterialModule.forRoot(), ，但是在我的延迟加载的组件/模块中，这个MaterialModule不是除非我在所有延迟加载的模块中明确导入它，否则可用。

app-module.ts
imports: [
BrowserModule,
AppRoutingModule,
MaterialModule.forRoot(),
CoreModule]

==============

material-module.ts
export class MaterialModule {
  static forRoot(): ModuleWithProviders {
  return {
    ngModule: MaterialModule
   }
 }
}

有没有办法可以在 angular.js 中的所有延迟加载模块中使用共享模块（如这个 MaterialModule）。

Answer 1

这里没有错。 模块的声明仅当它们在模块中导出并且模块被导入到您想要使用它们的另一个模块中时才可用，只有提供程序中的内容将在您的整个应用程序中共享。

拥有一个带有 forRoot 的模块只是一个约定，可以将事物初始化一次，或者构建一个单例模式。

但是如果你想使用那个模块中的东西，你必须在你需要的每个模块中导入它，当然没有 forRoot 。

这就是作用域的全部，提供者有一个全局作用域，这意味着它在任何地方都是可见的。 声明具有私有作用域，这意味着它们仅在当前模块内可见。 如果您想在其他地方使用它们，您需要将它们导出到它们自己的模块中，然后将该模块导入另一个模块中以使用它们。

这是一篇关于 ngModules 的文章，它更详细地解释了它： https ://medium.com/@cyrilletuzi/understanding-angular-modules-ngmodule-and-their-scopes-81e4ed6f7407

当谈到延迟加载时，它是相同的，除了延迟加载模块的提供者只有在模块加载后才可用。