mdMenu doesn't work in angular material version: 2.0.0-beta.11

Question

What's wrong with this code:

<button md-button [mdMenuTriggerFor]="menu">Menu</button>
<md-menu #menu="mdMenu">
  <button md-menu-item>Item 1</button>
  <button md-menu-item>Item 2</button>
</md-menu>

I got error:

Template parse errors: There is no directive with "exportAs" set to "mdMenu" ("

Menu ]#menu="mdMenu"> Item 1
Item 2 "): ng:///UserModule/UserRegistrationComponent.html@113:9

EDIT: 1

Also I try this:

<button mat-button [matMenuTriggerFor]="menu">Menu</button>
<mat-menu #menu="matMenu">
  <button mat-menu-item>Item 1</button>
  <button mat-menu-item>Item 2</button>
</mat-menu>

I got this error:

Template parse errors: There is no directive with "exportAs" set to "matMenu" ("

Menu ]#menu="matMenu"> Item 1
Item 2 "): ng:///UserModule/UserRegistrationComponent.html@113:10

EDIT: 2

My imports:

import {
  MatMenuModule,
  MatButtonModule
} from '@angular/material';

EDIT: 3

My user.module :

import { NgModule } from '@angular/core';

import { SharedModule } from '../../shared/shared.module';
import { UserRoutingModule } from './user-routing.module';
import { UserService } from './user.service';

// material
import {
  MatCardModule,
  MatMenuModule,
  MatInputModule,
  MatButtonModule,
  MatCheckboxModule
} from '@angular/material';

import { UserComponent } from './user.component';
import { UserProfileComponent } from './user-profile/user-profile.component';
import {
  UserRegistrationComponent
} from './user-registration/user-registration.component';
import {
  UserRestorePasswordComponent
} from './user-restore-password/user-restore-password.component';

@NgModule({
  imports: [
    SharedModule,
    UserRoutingModule,
    MatCardModule,
    MatMenuModule,
    MatInputModule,
    MatButtonModule,
    MatCheckboxModule
  ],
  declarations: [
    UserComponent,
    UserProfileComponent,
    UserRegistrationComponent,
    UserRestorePasswordComponent
  ],
  providers: [
    UserService
  ]
})
export class UserModule { }

this is my user.registration.component.html :

<button mat-button [matMenuTriggerFor] = "menu">Menu</button>
<mat-menu #menu = "matMenu">
  <button mat-menu-item>Item 1</button>
  <button mat-menu-item>Item 2</button>
</mat-menu>

Answer 1

The problem is with your angular version. Update your angular version to 4.4.3 or greater. Material 2.0.0-beta.11 depends on 4.4.3 or greater. From the CHANGELOG documentation:

Breaking changes Angular Material now requires Angular 4.4.3 or greater

Link to working demo .