如何打开/关闭角度材料菜单

Question

我最近开始使用角度材料，并且正在挣扎/不确定打开/关闭垫子菜单... 我在角度材料文档站点的示例中看到，他们为菜单分配了一个 id，然后将指令应用于用于切换菜单的按钮。例如 [matMenuTriggerFor]="menu"

我怎样才能编写一个这样做的指令？ 我不确定如何将对特定菜单的引用传递给指令，然后使用该 id 在 DOM 元素上调用 toggle() 方法？

以下代码生成错误：

无法绑定到"matMenuTriggerFor"，因为它不是"按钮"的已知属性。

没有将"exportAs"设置为"matMenu"的指令。
我的代码：

<li>
    <button mat-icon-button [matMenuTriggerFor]="stockSystemMenu">
        <mat-icon class="sn-item">
            <i class="material-icons">archive</i>
        </mat-icon>
    </button>
    <span class="sn-item" (click)="toggleMenu(stockSystemMenu)">Stok System</span>
    <mat-menu #stockSystemMenu="matMenu">
        <button mat-menu-item>
            <mat-icon>
                <i class="material-icons">chevron_right</i>
            </mat-icon>
        <span>Service 1</span>
        </button>
    </mat-menu>
</li>

Answer 1

存在混淆，因为据我所知，材料引入了重大更改。 查看材料 2 更新日志 - 重大更改

从材料 2.0.0-beta.12 开始。 使用mat而不是md-*.. 似乎只有 material.angular.io 的一些文档使用 mat 进行了更新。 具体来说，如果您单击查看源代码并查看md，我相信他们还没有将其替换为mat。

因此，要么更新到材料 2.0.0-beta.12 并使用 mat-* ，要么使用 md-* 。

Answer 2

"你的代码是正确的，你不需要写matMenuTriggerFor 指令，它是API的一部分，确保你已经将MatMenuModule，MatButtonModule和MatIconModule导入到你的应用程序模块中。