angular - 如何从 Angular Material `mat-menu`中获取所选项目

标签 angular angular-material

我正在使用一个 Angular Material 菜单组件

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

我如何监听选择的变化?有没有一种方法可以检查用户选择了哪个项目,而无需分别监听每个按钮的点击事件?

最佳答案

最好的方法是使用循环。 像这样的东西:

    const options = ['option1','option2'];

    <button mat-button color="primary" [matMenuTriggerFor]="menu">Copy</button>

    <mat-menu #menu="matMenu">
            <button (click)="onClick(option)" *ngFor="let option of options" mat-menu-item>
                {{option}}
            </button>
    </mat-menu>

关于angular - 如何从 Angular Material `mat-menu`中获取所选项目,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63996098/

相关文章:

javascript - 使用 System.js 在 Angular 2 应用程序中导入 Visionmedia 调试以及如何记录消息?

angular - 水平滚动 Angular Material Stepper 表单标题项

javascript - 基于选择的路由器

angular - Material 自动完成 : Link multiple text inputs to one autocomplete panel

angular - 如何在 Angular Material 卡中缩小字幕文本

angular - 从另一个组件打开/关闭 sidenav

javascript - 打开时 Material Dropdown 组件的 Z-Index 不在固定 div 下方分层

angular - angular2 如何检测有状态管道的变化?

Angular 2 : 404 exception handling

angular - Angular map 的 ZoomChange 或 centerChange 事件?