首页 > 解决方案 > 使用 FormArrayControl Angular 从动态表访问数据

问题描述

我有一个由列表创建的动态表,在用户单击复选框后,每一行都有一个复选框我希望能够访问该复选框列的所有列值,我被告知我需要一个 FormArray 来执行此操作,但是我不知道怎么做

这是我的表:

  <div  class="table-responsive angular-bootstrap-table">
    <table class="table table-head-custom table-vertical-center overflow-hidden">
      <thead>
        <th>
          # 
        </th>
        <th>
          Desc

        </th>
        <th>
          Cap
        </th>
        <th>
          $$$
        </th>
      </thead>
      <ng-container  *ngFor="let habDispo of mySet ">
      <ng-container formArrayName="info" *ngFor="let tipe of cuartos let i=index">
      <tbody *ngIf="tipe.Number == habDispo" [formGroup]="i">
        <tr>
          <td formControlName="Checked"><mat-checkbox (checked)="preAsignar(tipocuarto.Numero)"></mat-checkbox> &nbsp; {{ tipocuarto.Numero }}</td>
          <td formControlName="cuartoDescripcion">{{ tipocuarto.Descripcion}}</td>
          <td formControlName="cuartoPersonas">{{ tipocuarto.Personas }} Adultos</td>
          <td formControlName="cuartoTarifa">{{ tipocuarto.Tarifa }}.00</td>
        </tr>
      </tbody>
    </ng-container>
  </ng-container>
    </table>
  </div>
  {{this.formGroup.value | json}} //which returns every forvalue in my form but the formarray comes empty without any controls or values

在我的 Ts 文件上

   this.formGroup = this.fb.group({
     
      infoCuartos:this.fb.array([
        
      ])
    });

用户选择复选框后如何访问我的表格数据?

标签: angularangular-reactive-formsformarray

解决方案


推荐阅读