使用 formcontrol 将数据绑定到角度材料表中的复选框。数据以真假值列表的形式提供

Posted 2023-03-13

【中文标题】使用 formcontrol 将数据绑定到角度材料表中的复选框。数据以真假值列表的形式提供

【英文标题】：Bind data to checkbox in angular material table using formcontrol. Data is available as list of true,false values

【发布时间】：2021-04-17 12:09:10

【问题描述】：

HTML

<ng-container matColumnDef="view">
    <mat-header-cell *matHeaderCellDef mat-sort-header>View</mat-header-cell>
       <mat-cell *matCellDef="let element; let i=index"> 
          <mat-checkbox formControlName="view" (change)=updateCheckedList(element)>
         </mat-checkbox>
       </mat-cell>
</ng-container>  ```

**TS**

视图 = [真、假、假、真]

createRoleForm(): FormGroup
  
      return this._formBuilder.group(
          id              : [this.role.id],
          name            : [this.role.name],
         // view : 

      );
  

我需要根据视图列表的值来检查材料表（视图列）中的复选框。

【问题讨论】：

我想你在找这个：***.com/a/43771219/4799922

【参考方案1】：

您不能这样做，因为您的表单控制器对视图只有一个控件 所以你需要你的模型，它对你有帮助

    <ng-container matColumnDef="view">
        <mat-header-cell *matHeaderCellDef mat-sort-header>View</mat-header-cell>
           <mat-cell *matCellDef="let element; let i=index"> 
              <mat-checkbox [(ngModel)]="element.checked" 
               [ngModelOptions]="standalone: true" 
               (change)=updateCheckedList(element)>
             </mat-checkbox>
           </mat-cell>
</ng-container>

在元素内部使用创建一个名为checked的属性

方式 2 - 如果您想使用受控的表单，则需要使用表单数组