'Angular Material Menu module: Export of name 'matMenu' not found
I have a little issue with Angular Material Menu module.
I have this code in my app.module.ts:
import { SharedModule } from './shared/shared.module';
@NgModule({
declarations: [
// ...
],
imports: [
SharedModule,
],
})
export class AppModule { }
In my shared.module.ts:
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { MatMenuModule } from '@angular/material/menu';
import { ListDropdownComponent } from './list-dropdown/list-dropdown.component';
@NgModule({
declarations: [
ListDropdownComponent,
],
imports: [
MatMenuModule,
],
exports: [
ListDropdownComponent,
],
})
export class SharedModule { }
In my list-dropdown.component.ts:
import { Component, OnInit, Output, EventEmitter, Input } from '@angular/core';
@Component({
selector: 'app-list-dropdown',
templateUrl: './list-dropdown.component.html',
styleUrls: ['./list-dropdown.component.scss']
})
export class ListDropdownComponent implements OnInit {
constructor() { }
ngOnInit(): void {
}
}
In the list-dropdown.component.html:
<button mat-icon-button [matMenuTriggerFor]="menu">
My dropdown menu
</button>
<mat-menu #menu="matMenu">
<!-- ... -->
</mat-menu>
Then I have this error message:
Error: Export of name 'matMenu' not found!
I can't see where is the problem here?
Solution 1:[1]
I had the same problem and a server restart fixed it.
Solution 2:[2]
I had the same problem executing the unit tests.
Solved by importing MatMenuModule to the TestBed:
beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [MatMenuModule],
declarations: [YOURCOMPONENT],
}).compileComponents();
});
Solution 3:[3]
I had the same problem - close your terminal and again start server (ng serve).
Solution 4:[4]
I got this problem today and what you need to do is just import this line below in the current component's module you using matMenu
import { MatMenuModule } from '@angular/material/menu';
Solution 5:[5]
For me, just restarting ng serve
wasn't enough. I didn't get rid of the error, until I removed the mat-menu
directives from the template, restarted ng serve
, and then simply added the mat-menu
stuff back to the template. Crazy error!
Solution 6:[6]
I had the same error and restarting the server just worked for me!
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|---|
Solution 1 | Jadamae77 |
Solution 2 | |
Solution 3 | Naveen Patel |
Solution 4 | 0xLogN |
Solution 5 | Touré Holder |
Solution 6 | Ari |