javascript - 无法绑定(bind)到 'mdMenuTriggerFor'，因为它不是 'button' 的已知属性

Question

这个问题已经有答案了:

Can't bind to 'matMenuTriggerFor' since it isn't a known property of 'button' (7 个回答)

已关闭 4 年前。

使用 ngserve 运行我的 Angular 应用程序时遇到此错误:

Can't bind to 'mdMenuTriggerFor' since it isn't a known property of 'button'

我已经导入了所需的所有内容，所以我不明白为什么会发生这种情况。

模块.ts:

.......
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { BrowserModule } from '@angular/platform-browser';
import { MyDialogComponent } from './components/my-dialog/my-dialog.component';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatDialogModule, MatButtonModule, MatCheckboxModule, MatToolbarModule, MatInputModule, MatProgressSpinnerModule, MatCardModule, MatIconModule } from '@angular/material';
import { MatMenuModule} from '@angular/material/menu';
import 'hammerjs';

@NgModule({
  declarations: [
    AppComponent,
    HeaderComponent,
    FooterComponent,
    MainComponent,
    MyDialogComponent
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
    BrowserAnimationsModule,
    ReactiveFormsModule,
    FormsModule,
    MatDialogModule, MatButtonModule, MatCheckboxModule, MatToolbarModule, MatInputModule, MatProgressSpinnerModule, MatCardModule, MatMenuModule, MatIconModule
  ],
  entryComponents: [MyDialogComponent],
  providers: [DataService],
  bootstrap: [AppComponent]
})
export class AppModule { }

html:

<mat-toolbar>My App


  <span class="spacer"></span>
  <button md-icon-button [mdMenuTriggerFor]="menu">
      <md-icon>more_vert</md-icon>
    </button>

</mat-toolbar>

出现此错误的任何原因？我的意思是，正如您所看到的，所有内容都已导入，那么为什么它没有按预期运行？

Answer 1

如果您使用最新的 @angular/material 依赖项，则应将其替换为 matMenuTriggerFor(mdMenuTriggerFor 已弃用):

<button mat-icon-button [matMenuTriggerFor]="menu">
   <mat-icon>more_vert</mat-icon>
</button>

当然还要导入你的模块

import {MatMenuModule} from '@angular/material/menu';

并将其添加到 imports block 中。

https://material.angular.io/components/menu/api