Angular Material 图标 mat-icon 未正确显示

Question

我正在使用 angular-material 在我的 angular 4 应用程序中创建抽屉导航。
最初，我正在创建一个具有标题和菜单按钮的工具栏(mat-icon 是菜单)

这是我的代码，

<mat-toolbar class="example-header" color="primary">
    <button mat-icon-button><mat-icon>menu</mat-icon></button>
<span class="header-name">Hello</span>
</mat-toolbar>

但我得到的输出如下，



但我想要输出这样的东西，



输出的不同之处在于，mat-icon 按钮具有灰色背景，而 required 则没有。
请纠正我。

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AgmCoreModule } from '@agm/core';
import { MapsAPILoader } from '@agm/core';
import { FormsModule } from '@angular/forms';
import { GoogleMapsAPIWrapper } from '@agm/core';
import { AppComponent } from './app.component';
import 'hammerjs';
import {
  MatAutocompleteModule,
  MatButtonModule,
  MatButtonToggleModule,
  MatCardModule,
  MatCheckboxModule,
  MatChipsModule,
  MatDatepickerModule,
  MatDialogModule,
  MatExpansionModule,
  MatFormFieldModule,
  MatGridListModule,
  MatIconModule,
  MatInputModule,
  MatListModule,
  MatMenuModule,
  MatNativeDateModule,
  MatPaginatorModule,
  MatProgressBarModule,
  MatProgressSpinnerModule,
  MatRadioModule,
  MatRippleModule,
  MatSelectModule,
  MatSidenavModule,
  MatDrawer, MatDrawerContainer, MatDrawerContent,
  MatSliderModule,
  MatSlideToggleModule,
  MatSnackBarModule,
  MatSortModule,
  MatTableModule,
  MatTabsModule,
  MatToolbarModule,
  MatTooltipModule,

  MatStepperModule,
  MATERIAL_SANITY_CHECKS
} from '@angular/material';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';


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

Answer 1

在您的 app.module.ts ，您忘记导入 MatButtonModule进入你的模块。 (顺便说一句，如果你甚至不使用它，你不应该导入每个模块。这是个坏主意!)

@NgModule({
  imports: [
    MatButtonModule
    // ...
  ]
})