升级到版本 9 后出现 Angular 抛出 Material 错误答案

【问题标题】：Angular throwing Material errors after upgrading to version 9升级到版本 9 后出现 Angular 抛出 Material 错误
【发布时间】：2020-11-03 03:50:24
【问题描述】：

我已将 Angular 项目从 v8 更新到 v9，并遵循了所有必需的更新，但运行 ng serve 会引发重大错误。我单独导入了所有材料组件，而不是直接从@angular/material 导入，并将所有这些都包含在单独的文件material.module.ts 中。此文件在 app.module.ts 中导入，但 Angular 仍然没有检测到任何材料组件并抛出以下错误：

以下是依赖项：

注意： 我已经尝试了几乎所有可用的解决方案，并在没有成功后提出这个问题。

【问题讨论】：

标签： angular angular-material angular-upgrade

【解决方案1】：

您项目的真正问题是将所有这些都包含在单独的文件 material.module.ts 中。从 Angular 9+ 开始，您应该明确声明导入了哪些材质模块，而不是创建一个共享模块。我之前通过重构大部分自己的模块解决了一个问题。这里一步一步是：

删除Shared Material Module
运行打印出所有自己的模块有问题
明确声明与之关联的材料模块。

@NgModule({
   imports: [
      MatToolbarModule
   ]
})
export class OwnModule { }

我知道这很痛苦，但我们别无选择升级 Angular 9+。

【讨论】：

两个月前我遇到了同样的问题。我修复了添加我自己的模块然后导入app.module.ts
@Johnathan 你的意思是我必须在组件中导入模块而不是 app.module ？
正确，您应该像在自己的模块中使用的一样导入材质模块，而不是在 app.module 或共享模块中声明它们。我不知道你的项目结构如何，但上面有新的做法。 Anw，在 app.module 中，如果您有任何使用 Material 的子组件，您也应该导入。
但是文档说：你应该从特定组件深度导入，而不是从 @angular/material 导入。例如。 @角/材料/按钮。他们没有提到任何不导入 app.module 而是导入组件的地方。在每个组件中导入并非易事。
不是组件，在你的模块级别声明它。这就是为什么我说它很痛苦的原因。我知道做这份工作很难，但我尝试了很多次并研究了背后的原因。它属于新常春藤。您应该使用 Material Modules 导入任何具有 declerations 组件的模块。回到 app.module.ts，它只是一个模块。您有两个声明组件，即 NavComponent 和 HeaderComponent。他们正在使用 MatToolbarModule，所以你必须在 imports 这个模块中声明。