首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何在另一个FormArray中访问FormArray

在另一个FormArray中访问FormArray的方法是通过使用嵌套的索引来访问。以下是一个示例代码,展示了如何在另一个FormArray中访问FormArray:

代码语言:txt
复制
import { Component } from '@angular/core';
import { FormArray, FormControl, FormGroup } from '@angular/forms';

@Component({
  selector: 'app-example',
  template: `
    <form [formGroup]="myForm">
      <div formArrayName="outerFormArray">
        <div *ngFor="let innerFormArray of outerFormArray.controls; let i = index">
          <div [formGroupName]="i">
            <input formControlName="innerControl" placeholder="Inner Control">
          </div>
        </div>
      </div>
    </form>
  `,
})
export class ExampleComponent {
  myForm: FormGroup;

  get outerFormArray(): FormArray {
    return this.myForm.get('outerFormArray') as FormArray;
  }

  constructor() {
    this.myForm = new FormGroup({
      outerFormArray: new FormArray([
        new FormGroup({
          innerControl: new FormControl('Value 1'),
        }),
        new FormGroup({
          innerControl: new FormControl('Value 2'),
        }),
      ]),
    });
  }
}

在上面的示例中,我们创建了一个名为myForm的FormGroup,并在其中创建了一个名为outerFormArray的FormArray。在模板中,我们使用formArrayName指令将outerFormArray绑定到外部div元素上。

然后,我们使用*ngFor指令遍历outerFormArray.controls,并使用formGroupName指令将每个内部FormArray绑定到内部div元素上。这样,我们就可以在内部div中访问内部FormArray中的控件。

在示例中,我们使用一个简单的input元素来展示内部控件的访问。你可以根据需要添加更多的控件或自定义模板。

请注意,这只是一个示例,你可以根据自己的需求进行修改和扩展。对于更复杂的场景,你可能需要使用更多的嵌套索引来访问更深层次的FormArray。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

领券