如何设置formControlName(以HTML格式)以控制嵌套3次的formArray内部?

时间:2019-06-17 17:06:03

标签: angular

所以我无法弄清楚这一点。我的FormGroup看起来像这样:

templateForm = new FormGroup({
    title: new FormControl(),
    description: new FormControl(),
    items: new FormArray([
    new FormGroup({
        type: new FormControl('table'),
        rows: new FormArray([
            new FormGroup({
                    header: new FormControl(''),
                    values: new FormArray([
                        new FormControl('Test')
                    ])
                })
        ])
        })])
  });

HTML:

<div *ngSwitchCase="'table'">
                    <table>
                      <thead>
                        <tr class="row">
                          <th class="col s2 m2 l2" *ngFor="let row of item.controls.rows.controls; index as rowIndex">
                            <a (click)="removeTableRow(i, rowIndex)" class="rmRow btn-floating btn-small waves-effect waves-light red"><i class="small material-icons">remove</i></a>
                          </th>
                          <th>
                            <a (click)="addTableRow(i)" class="btn-floating btn-small waves-effect waves-light blue"><i class="small material-icons">add</i></a>
                          </th>
                        </tr>
                      </thead>
                      <thead>
                        <tr class="row">
                          <th class="col s2 m2 l2" *ngFor="let row of item.controls.rows.controls; index as y">
                            <div formArrayName="rows">
                              <form [formGroup]="row" novalidate>
                                <input type="text" formControlName="header">
                              </form>
                            </div>
                          </th>
                        </tr>
                      </thead>
                      <tbody>
                        <tr class="row" *ngFor="let column of item.controls.rows.controls[0].controls.values.controls; index as y">
                          <div class="col s2 m2 l2" *ngFor="let row of item.controls.rows.controls">
                            <div *ngFor="let value of row.controls.values.controls; let valI = index">
                              <div formArrayName="values" >
                                <input type="text" [formControlName]="valI">
                              </div> !! How to set value in values array to formControl !!
                            </div>
                          </div>
                        </tr>
                      </tbody>
                    </table>
                  </div>

我的目标是显示一个表,第一行的列数高度。现在,我只是想不通如何设置HTML中的formControl来控制formArray中formArray中的formArray(是的)。

0 个答案:

没有答案