mdMenu ne fonctionne pas dans la version matérielle angulaire: 2.0.0-beta.11

Question

Quel est le problème avec ce 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> 

Je suis erreur:

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

J'essaie aussi ceci:

<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> 

J'ai eu cette erreur:

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

Mes importations:

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

EDIT: 3

Mon 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 { } 

ceci est mon 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

Le problème est avec votre version angulaire. Mettez à jour votre version angulaire à 4.4.3 ou supérieur. Le matériau 2.0.0-beta.11 dépend de 4.4.3 ou supérieur. De la documentation CHANGELOG:

Breaking changes Angular Material now requires Angular 4.4.3 or greater

Lien vers working demo.