Iterate Formarray Angular



我正试图根据用户输入的内容迭代我的行。例如,用户输入2的值,并返回相同的行值。以及如何将其插入FormArray 内部

setCount(count:any){
console.log(count);
this.count = count;
this.countArray = Array(parseInt(count)).fill(0).map((x,i)=>i);
}

<mat-form-field class="full-width">
<mat-label>Qty</mat-label>
<input matInput type="number" formControlName="qty" value="0" (click)="setCount($event.target.value)">
</mat-form-field>

<tr *ngFor="let Array of Array.controls; let i = index;" [formGroupName]="i">
<td>

</td>
<td>
<input type="text" formCOntrol="Number" class="form-control" style="width:700px">
</td>
</tr>

这是我的示例

https://stackblitz.com/edit/angular-pgwv3t

像这样尝试

fg: FormGroup;
get inputsArray(): FormArray {
return this.fg.get('inputs') as FormArray;
}
constructor(private fb: FormBuilder) {}
ngOnInit() {
this.fg = this.fb.group({
inputCount: [0],
inputs: this.fb.array([]),
});
this.fg.get('inputCount').valueChanges.subscribe((res) => {
for (let i = this.inputsArray.length; i < res; i++) {
this.inputsArray.push(this.addInputsItem());
console.log(this.inputsArray);
}
});
}
addInputsItem(): FormGroup {
return new FormGroup({
inputVal: new FormControl(0, { validators: [Validators.required] }),
});
}

示例代码

最新更新