仍然可以在 Mat 表中选择禁用的复选框答案

【问题标题】：Still able to select disabled checkbox in Mat table仍然可以在 Mat 表中选择禁用的复选框
【发布时间】：2019-10-20 01:18:15
【问题描述】：

我有一个带有复选框列的 Mat 表。我根据某些条件将某些复选框设置为禁用。但是，如果单击该行，用户仍然可以选择该复选框。如何在禁用时防止复选框被选中：这是我从材料设计站点分叉的 stackblitz 示例：https://stackblitz.com/edit/angular-erpaus?file=app%2Ftable-selection-example.html。你不能点击复选框，但如果你点击它之外的复选框被选中：

<mat-checkbox (click)=      "$event.stopPropagation()"
                              (change)="$event ? selection.toggle(row) :null"
                              [checked]="selection.isSelected(row)" 
                              [disabled]="myCondition"
                               color="primary">
                </mat-checkbox>

【问题讨论】：

从 tr-mat-row 中移除 (click)="selection.toggle(row)"
@AmitBaranes 或使用类似于禁用条件的条件
谢谢这工作。但是为什么selection.toggle(row) 允许这样做呢？

标签： angular checkbox mat-table

【解决方案1】：

正如@AmitBaranes 所说，删除(click)="selection.toggle(row)" 应该可以工作，但如果条件为true，您将无法选择一行。如果您想禁用某些行并启用其他行，您可以实现类似(click)="!row.excluded && selection.toggle(row)" 的条件。请参阅stackblitz 中的完整示例。

【讨论】：

【解决方案2】：

我认为，当您单击行时，该行被选中。在您的代码中：[checked]="selection.isSelected(row)" 检查是否选择了行，当此表达式返回 true 时，复选框将被选中，因此您必须在单击后关闭选择行。

【讨论】：