将 angular material 的垫子图标与 Angular 一起使用时出错 10

Question

我有一个 MaterialModule

import { NgModule } from '@angular/core';
import {MatButtonModule} from '@angular/material/button';
import {MatIconModule} from '@angular/material/icon';

@NgModule({
 declarations: [],
 imports: [
  MatButtonModule,
  MatIconModule
 ]
})
export class MaterialModule { }

然后我将这个模块导入我的应用程序模块

然后在app.component.html我尝试使用mat-icon组件

<button mat-button>
<mat-icon>face</mat-icon>
Click me!
</button>

但总是出现此错误

有什么想法吗？

谢谢

Answer 1

您必须在 MaterialModule 中同时导出 MatButtonModule 和 MatIconModule

import { NgModule } from '@angular/core';
import {MatButtonModule} from '@angular/material/button';
import {MatIconModule} from '@angular/material/icon';

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

将 angular material 的垫子图标与 Angular 一起使用时出错 10

Error using mat-icon of angular material with Angular 10

angular

angular-material-7