我正在尝试在formarray中实现formarray,但它不起作用,在下面尝试但是不起作用。
How to get FormArrayName when the FormArray is nested in another FormArray?
有人可以帮助我,我在下面的代码中做错了吗
HTML
<div [formGroup]="MainFormGroup" class="custom-auto-complete">
<mat-radio-group matInput formControlName="Applies">
<mat-radio-button *ngFor="let applie of applies" [value]="applie.id">{{applie.value}}</mat-radio-button>
</mat-radio-group>
<div formArrayName="FormArrayOne">
<div *ngFor="let mains of MainFormGroup.get('FormArrayOne')['controls']; let i=index">
<div [formGroupName]="i">
<mat-icon *ngIf="MainFormGroup.get('FormArrayOne').length > 1" (click)="removeMarket(i)">remove_circle</mat-icon>
<mat-icon (click)="addOne()"> add_circle</mat-icon>
<mat-form-field>
<input matInput formControlName="OneField" value="">
</mat-form-field>
<div formArrayName="FormArrayTwo">
<div *ngFor="let Market of MainFormGroup.get('FormArrayTwo')['controls']; let j=index" >
<div [formGroupName]="j">
<mat-form-field class="formfieldsControl">
<input matInput formControlName="Destination">
</mat-form-field>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
TS
public ngOnInit() {
this.MaintFormGroup = this._fb.group({
Applies : '',
FormArrayOne: this._fb.array([
this.initArrayOne(),
])
});
}
public initArrayOne() {
return this._fb.group({
OneField: '',
FormArrayTwo : this._fb.array([
this.initFormArrayTwo()
])
});
}
public addMarket() {
const control = <FormArray> this.MaintFormGroup.get('FormArrayOne');
control.push(this.initArrayOne());
}
public removeMarket(i: number) {
const control = <FormArray> this.MaintFormGroup.get('FormArrayOne');
control.removeAt(i);
}
public initFormArrayTwo() {
return this._fb.group({
Destination : ''
});
}
public addFormArrayTwo() {
const Control = <FormArray> this.MaintFormGroup.get('FormArrayTwo');
Control.push(this.initFormArrayTwo());
}
public removeFormArrayTwo(j: number) {
const Control = <FormArray> this.MaintFormGroup.get('FormArrayTwo');
Control.removeAt(j);
}