Angular 8 - 将所有 Material 模块导入主应用程序模块是否比在不同模块中导入单个 Material 模块更好？

Question

将 Material 模块导入 Angular 8 项目的最佳方法是什么？是不是通过将material.module.ts导入app主模块，然后在其他模块中使用:

import { NgModule } from '@angular/core';

import {
  MatButtonModule,
  MatMenuModule,
  MatToolbarModule,
  MatIconModule,
  MatCardModule
} from '@angular/material';

@NgModule({
  imports: [
    MatButtonModule,
    MatMenuModule,
    MatToolbarModule,
    MatIconModule,
    MatCardModule
  ],
  exports: [
    MatButtonModule,
    MatMenuModule,
    MatToolbarModule,
    MatIconModule,
    MatCardModule
  ]
})
export class MaterialModule {}

或者干脆在各个模块中导入material的主要使用模块？

例如，如果我只在 ProductsModule 中使用 mat-card，我只需在 products 模块中导入 MatCardModule 并完成它.

Answer 1

这完全取决于您将在应用内使用 Angular Material 公开的所有组件的位置。

如果某些模块中只有某些组件使用 Angular Material 公开的组件，那么将这些模块导入到这些组件所属的模块中是有意义的。

例如: 假设您的应用程序具有三个模块:CartModule , CheckoutModule , ProfileModule .只有你的CartModule使用 Angular Material 组件之一。如果这个 CartModule是延迟加载的。在这种情况下，在 CartModule 中导入特定的 Angular Material 模块会很有意义。 .

---

但是，在大多数情况下，情况并非如此。

在大多数情况下，为了保持一致的外观和感觉，我们通常倾向于在整个应用程序中使用 Angular Material 模块公开的大量组件。因此，在这种情况下，为了使其更加统一和易于管理，我们通常创建一个 AppMaterialModule您在问题本身中所做的方式。然后我们import这个模块在我们想要使用这些组件的模块中。如果我们要在整个应用程序的不同模块中使用这些组件，我们通常导入 AppMaterialModule在 SharedModule并从那里导出。这样，我们作为 AppMaterialModule 的一部分公开的组件可以在整个应用程序中访问。

希望这能消除您的疑虑。