mat-button 不是已知元素

Question

我不明白。 我想我导入了所有必要的模块，但它一直告诉我：

'mat-button' is not a known element:

应用程序模块.ts：

import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';

import { AppComponent } from './app.component';

@NgModule({
  imports: [
    BrowserModule,
    FormsModule,
    BrowserAnimationsModule,
    MatButtonModule,
  ],
  declarations: [AppComponent],
  providers: [],
  bootstrap: [AppComponent],
})
export class AppModule {}

应用程序组件.ts：

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

@Component({
  selector: 'app-root',
  templateUrl: 'app.component.html',
  styleUrls: ['app.component.scss'],
})
export class AppComponent {
  constructor() {}
}

应用程序组件.html

<mat-button>foo</mat-button>

app.component.scss 是空的。

我知道有很多关于这个的帖子。 但是没有任何帮助，因为我认为我正确地导入了所有内容（ MatButtonModule ）。 有人知道我能做什么吗？

Answer 1

这是：

<button mat-button>foo</button>

不是

<mat-button>foo</mat-button>

官方文件。