angular mat-menu not showing using matMenuTriggerFor

Viewed 2368

I'm trying to create a simple menu to show when clicking on a button, but I'm not able to get matMenuTriggerFor to work. You can see the whole project at https://github.com/yperess/risc16 (it's basically just a stub).

The main issue is the toolbar component:

<button mat-button [matMenuTriggerFor]="fileMenu">File</button>
<mat-menu #fileMenu="matMenu">
  <button mat-menu-item>Hello</button>
</mat-menu>

Here, clicking on the File button doesn't open the menu.

2 Answers

When you click the 'File' button you get the following error in the console:

ERROR Error: Found the synthetic listener @transformMenu.start. Please include either "BrowserAnimationsModule" or "NoopAnimationsModule" in your application.

Simply add one of these modules to your imports and your menu will work correctly.

https://stackblitz.com/edit/github-xtpwhw?file=src/app/app.module.ts

import { BrowserAnimationsModule } from '@angular/platform-browser/animations';

please import above animation package in app.module.ts file , it will work nicely

Related