3

将材料模块导入 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的主要使用模块？

例如，如果我只使用mat-cardin ProductsModule，我只需导入MatCardModuleproducts 模块并完成它。

4

4 回答 4

5

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

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

例如：为了争论，假设您的应用程序具有三个模块：CartModule、CheckoutModule、ProfileModule。并且只有您CartModule使用 Angular 材质组件之一。此外，如果这CartModule是延迟加载。在这种情况下，将特定的 Angular 材质模块导入到CartModule.

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

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

希望这能消除您的疑虑。

于 2019-07-15T11:40:12.653 回答
1

最好的方法是只在他需要的每个组件中导入，在 app.module.ts 中只导入全局服务。使用角度超过 2 年，但没有找到最佳解决方案

于 2019-07-15T11:26:42.637 回答
1

是的，如果是这样的话

如果我只在产品模块中使用 mat-card，我只需导入 MatCardModule。

那也行。

但是以后如果你想在 B 模块中使用它，你也不应该在那个模块中导入它。但是将 MatCarModule 移动到 MaterialModule。

并且 MaterialModule 应该由 Shared 模块导入和导出。

不建议在每个模块中直接导入它，原因有两个：

  1. 如果 B 和 Products 模块是延迟加载的，那么相同的 MatCardModule 将最终出现在两个块中（这很糟糕）
  2. 由于这是一个组件模块，我们很可能最终也会在其他地方使用它。所以首选 MaterialModule 方式。
于 2019-07-15T11:44:24.433 回答
1

好吧，如果您在整个应用程序中使用角度材料组件，您应该将您的角度材料模块放在共享模块中，有些可能是 shared/modules/material.modules.ts，但如果您的应用程序中只有一些组件，您应该只在特定组件中导入材料模块...

于 2021-01-19T16:14:20.827 回答