【问题标题】:Angular Mat-table with expandable rows - stop expansion on row button click具有可扩展行的 Angular Mat-table - 单击行按钮时停止扩展
【发布时间】:2020-05-29 02:17:22
【问题描述】:

我希望在用户单击行上的按钮时禁用行扩展。特别是如果我们每行都有一个弹出菜单,当行扩展同时发生时,它真的会分散注意力。有没有办法阻止这种情况发生。

参见下面的示例,当用户尝试单击行右端的三个垂直点时,行会展开。事实上,这发生在任何按钮单击行上。 https://stackblitz.com/edit/angular-uy3mc4-cfmqoh

【问题讨论】:

    标签: angular angular-material mat-table angular-material-table


    【解决方案1】:

    一个简单的方法是调用$event.stopPropagation() 事件处理程序来阻止面板接收点击事件。例如:

    而不是

    <button mat-icon-button (click)="editAsset(row)" title="Edit">
       <mat-icon color="primary">mode_edit</mat-icon>
    </button>
    

    使用

    <button mat-icon-button (click)="$event.stopPropagation(); editAsset(row)" title="Edit">
       <mat-icon color="primary">mode_edit</mat-icon>
    </button>
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2020-11-13
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2019-05-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多