angular – 模板解析错误:没有将“exportAs”设置为“matMenu”的指令

随着Angular Material及其 breaking changes的新更新,我无法再使用我的< md-menu>组件.我在导入MaterialModule时工作,但现在导入MatMenuModule或MdMenuModule时会产生以下错误

compiler.es5.js:1690 Uncaught Error: Template parse errors:
There is no directive with "exportAs" set to "matMenu" ("
</mat-toolbar>
  <mat-menu xPosition="after" [ERROR ->]#wordListMenu="matMenu" 
): 
ng:///NavbarModule/NavbarComponent.html@38:28

我遵循documentation的指南和API,但语法似乎已经改变了?我已经尝试了#wordListMenu =“matMenu”和#wordListMenu =“mdMenu”并且错误仍然存​​在.

我的html文件(相关部分)是:

<button mat-button [md-menu-trigger-for]="wordListMenu" [ngClass]="{'active' 
  : isActive(['/wordlist'])}">
  Word Lists
</button>
<mat-menu xPosition="after" #wordListMenu="matMenu" 
  [overlapTrigger]="false">
  //Content of menu
</mat-menu>

我的模块是:

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import {NavbarComponent} from 'app/navbar/navbar.component';
import { MdTooltipModule,MatMenuModule } from '@angular/material';

@NgModule({
  imports: [
    CommonModule,MdTooltipModule,MatMenuModule
  ],declarations: [NavbarComponent],exports: [NavbarComponent]
})
export class NavbarModule { }

有什么我想念的吗?为什么编译器不识别matMenu?

解决方法

问题出在你的角度版本上.将角度版本更新为4.4.3或更高版本. Material 2.0.0-beta.11取决于4.4.3或更高版本.从 CHANGELOG文档:

Breaking changes
Angular Material Now requires Angular 4.4.3 or greater

链接working demo.

相关文章

ANGULAR.JS:NG-SELECTANDNG-OPTIONSPS:其实看英文文档比看中...
AngularJS中使用Chart.js制折线图与饼图实例  Chart.js 是...
IE浏览器兼容性后续前言 继续尝试解决IE浏览器兼容性问题,...
Angular实现下拉菜单多选写这篇文章时,引用文章地址如下:h...
在AngularJS应用中集成科大讯飞语音输入功能前言 根据项目...
Angular数据更新不及时问题探讨前言 在修复控制角标正确变...