在可编辑材料表中使用 mat-checkbox 时出错答案

【问题标题】：Error using mat-checkbox inside an editable material table在可编辑材料表中使用 mat-checkbox 时出错
【发布时间】：2021-01-13 03:52:03
【问题描述】：

我使用 Angular Material 创建了一个可编辑项，当一行处于可编辑状态时，每个单元格将根据所显示的数据类型显示一个输入字段，例如如果单元格是一个字符串，它将有一个“文本”类型的输入字段。

<mat-form-field>
   <mat-label> {{column}} </mat-label>
   <input type="text" matInput [(ngModel)]="element[column]"/>
</mat-form-field>

这在使用文本或数字时都可以正常工作，但我也想要一个布尔复选框，但是当我尝试使用 mat-checkbox 而不是输入时，我得到一个错误'mat-form-field must contain a MatFormFieldControl. '。尽管我使用 ngModel 与使用文本和数字时一样。

<div *ngIf="column === 'checkType'>
   <mat-checkbox [(ngModel)]="element[column]"></mat-checkbox>
</div>

任何帮助将不胜感激。

【问题讨论】：

标签： angular angular-material angular-material-table

【解决方案1】：

目前您不能在mat-form-field 内使用mat-checkbox（不支持）：请参阅https://github.com/angular/components/issues/7891

所以当你使用mat-checkbox 时，不要将它嵌套在mat-form-field 中。你可以直接给它一个formControlName 或[(ngModel)]，不用mat-form-field。

<mat-checkbox [(ngModel)]="myVariable">

【讨论】：