change - Angular 2: Acceso a datos desde FormArray

ng attr angular 2

Question

He preparado una de usar ReactiveForms proporcionado por angular2 / forms. Este formulario tiene una matriz de formularios de productos:

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

productFormGroupArray es una matriz de FormGroup Object.I recuperó los controles, es decir, el objeto FormArray usando esto:

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

Estoy tratando de obtener el elemento en la matriz de productos en el índice i . ¿Cómo se puede hacer esto sin hacer un bucle a través de la matriz?

Editar:

Probé con el método (índice) disponible:

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

pero esto está generando un error como:

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

Edición 2: checkoutData y el fondo se reciben del servidor.

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

Answer 1

// en el archivo de componentes .ts //

getName(i) {
return this.getControls()[i].value.name;
}
getControls() {
return (<FormArray>this.categoryForm.get(''categories'')).controls;
}

// en forma reactiva - Archivo de plantilla //

<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>

Answer 2

Simplemente lanza ese control a la matriz

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

y todas sus características están ahí

var item = arrayControl.at(index);

Answer 3

Un trazador de líneas como opción a la respuesta aceptada actual

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