'mat-toolbar' 不是已知元素

Question

我在 app.component.html 中使用过：

<mat-toolbar>
  Responsive side navigation
</mat-toolbar>

我在 app.module.ts 中定义了 MatToolbarModule

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppRoutingModule } from './app-routing/app-routing.module';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { MatToolbarModule } from '@angular/material/toolbar';

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

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    BrowserAnimationsModule,
    MatToolbarModule,
    MatSidenavModule,
    MatButtonModule,
    MatIconModule,
    MatDividerModule,
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

执行 ng build 命令时出现此错误：

Error: src/app/app.component.html:1:1 - error NG8001: 'mat-toolbar' is not a known element:
1. If 'mat-toolbar' is an Angular component, then verify that it is part of this module.
2. If 'mat-toolbar' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

请问如何纠正这个错误

Answer 1

根据您共享的内容（在任何更新之前），您的设置足以使其正常工作。 如果您在 VSCode 上关闭和打开 IDE，有时就足以解决这种编译错误。 这是与您上面的代码兼容的 stackblitz工作正常。