Angular 嵌套数组的 PatchValue

Question

我想在另一个数组中修补一个数组的值，我可以通过使用

来实现

this.myForm.value.array1[index1].array2[index2].type = type;

虽然它不会仅在代码中的表单值中更新屏幕上的表单值，但我使用下面的代码来修补第一个数组中的值并更新屏幕上的值我只是无法将其写入能够到达第二个数组

(<FormArray>this.myForm.controls['array1']).at(index1).get("type").patchValue(type);

谢谢:)

Answer 1

如果您不使用 setValue，Angular 更改值但 Angular 未反映在输入中，请不要将输入标记为已触摸...

所以

((this.myForm.get('array1') as FormArray)
       .at(index1).get('array2') as FormArray)
       .at(index2).get("type").patchValue(type);

或

this.form.get('array1.'+index1+'.array2.'+index2+'.type').patchValue(type)

注意 1：使用 get 访问数组元素的方式是 array1.index，因此 array1.0 获取数组的第一个元素，array1.1 第二个...

注意 2：建议使用方法 get(name) vs controls[name]

更新我不知道你的要求，但是如果你想简单地控制一个对象数组的数组，你可以使用 FormGroup 的 FormArrays 的 FormArray。

嗯，有些喜欢

formArray=new FormArray([
      new FormArray([
        new FormGroup({
           type:new FormControl('uno')
        }),
        new FormGroup({
           type:new FormControl('dos')
        }),
      ]),
      new FormArray([
        new FormGroup({
           type:new FormControl('tres')
        }),
        new FormGroup({
           type:new FormControl('cuatro')
        }),
      ])
    ])

可以在html中管理为

<div *ngFor="let array of formArray.controls">
  <div *ngFor="let group of array.controls" [formGroup]="group">
    <input formControlName="type">
  </div>
</div>

在这种情况下使用

(this.form.at(0) as FormArray).at(1).get('type').patchValue('new');

见stackblitz

Angular 嵌套数组的 PatchValue

Angular PatchValue of nested arrays

nativescript

angular

angular-reactive-forms