升级到Angular 12后，所有材料成分都是“不是已知元素”

Question

升级到Angular 12后，尽管我在App.Module.ts中具有所有必需的代码，但所有材料标签都无法识别：例如，对于Mat-Checkbox，我在app.module.ts

中有以下内容。

import { MatCheckboxModule } from '@angular/material/checkbox';

@NgModule({
    imports: [
    BrowserModule,  
    MatCheckboxModule,

在执行时：

'mat-checkbox'不是已知元素：

1. 如果'Mat-Checkbox'是一个角度组件，然后验证它是此模块的一部分。
IF“ Mat-Checkbox”是一个Web组件，然后将“ custom_elements_schema”添加到此组件的'@ngmodule.schemas'
2. 所有材料标签（Mat-icon，Mat-table，Mat-Label……）。
在以前的版本（Angular 9）中，一切都还可以。 感谢您的帮助

注意1（致命问题）

Answer 1

{
  ...
  loadChildren: 'path/to/your.module#YourModule'
}

将所有这些都放在您的项目中：

{
  ...
  loadChildren: () => import('path/to/your.module').then(m => m.YourModule)
}

即使您认为这与您当前的功能无关。这样做后，将解决问题。

注：

在升级到Angular12期间，如果某些NPM软件包破坏了您可以使用

npm i --save package-name --force

现在安装它。

注：

此外，如果您在TS文件中看到一些错误，则可以通过在错误行的顶部使用

// @ts-ignore

来抑制（忽略）它们。

NOTE4

此外，如果您看到一个错误，例如“类使用了角功能，但没有装饰。请添加显式的角度装饰”。

add

@Injectable()

在班级声明之上。

注释5 在我的想法中，如果您正在从较旧版本的Angular升级到Angular 12。 ng new APP_NAME --strict=false

目前您没有严格的模式。 解决所有问题并现在有一个工作项目时，您可以创建一个具有严格模式的新项目。

我假设您正在懒惰的模块。

是的，

创建一个共享模块，

IMPORT和导出共享模块中的所有材料模块， IMPORT在root（app）模块和功能（懒惰加载）模块中的共享模块。

如果不， 那你做的是对的。