Angular 2：从FormArray访问数据

Question

我已经准备好了使用angular2 / forms提供的ReactiveForms。此表单有一个表单数组产品：

this.checkoutFormGroup = this.fb.group({
            selectedNominee: ['', Validators.required],
            selectedBank: ['', Validators.required],
            products: productFormGroupArray
        });

productFormGroupArray是一个FormGroup Objects数组。我使用以下方法获取控件，即FormArray对象：

this.checkoutFormGroup.get('products')

我试图在索引i的products数组中获取元素。如何在不循环数组的情况下完成这项工作？

编辑：

我尝试使用at（index）方法：

this.checkoutFormGroup.get('products').at(index)

但这会产生一个错误：

Property 'at' does not exist on type 'AbstractControl'.

编辑2：从服务器收到checkoutData和fund。

this.checkoutData.products.forEach(product => {
                    this.fundFormGroupArray.push(this.fb.group({
                        investmentAmount: [this.fund.minInvestment, Validators.required],
                        selectedSubOption: ['', Validators.required],
                    }))
            });

Answer 1

只需将该控件转换为数组

var arrayControl = this.checkoutFormGroup.get('products') as FormArray;

它的所有功能都在那里

var item = arrayControl.at(index);

Answer 2

一个班轮作为当前接受答案的选项

(<FormArray>this.checkoutFormGroup.get('products')).at(index);

Answer 3

//在.ts组件文件中//

getName(i) {
    return this.getControls()[i].value.name;
  }

  getControls() {
    return (<FormArray>this.categoryForm.get('categories')).controls;
  }

//以反应形式 - 模板文件//

<mat-tab-group formArrayName="categories" class="uk-width-2-3" [selectedIndex]="getControls().length">
      <mat-tab
        *ngFor="let categoryCtrl of getControls(); let i = index"
        [formGroupName]="i"
        [label]="getName(i)? getName(i) : 'جديد'"
      >
</mat-tab>
</mat-tab-group>