我正在使用 angular8 反應形式來系結資料并在單擊添加新按鈕時添加新行，但是當我單擊添加新按鈕時，新的輸入行將位于編輯部分的底部，但我希望這樣出現在添加新按鈕的正下方，我也附上了演示。
HTML：
<button
type="button"
(click)="addOpportunityDetails()"
>
<i ></i> Add new
</button>
<form [formGroup]="opportunitiesForm" *ngIf="opportunitiesForm">
<ng-container formArrayName="opportunitesx">
<div
*ngFor="
let item of opportunitiesForm.get('opportunitesx')['controls'];
let i = index
"
[formGroupName]="i"
>
<div *ngIf="item.get('showHeader').value">
{{ item.get('header').value }}
</div>
<div >
<input
type="text"
placeholder="Quote Count"
formControlName="quoteCount"
maxlength="4"
/>
</div>
<div >
<input
type="text"
placeholder="Policy Count"
formControlName="policyCount"
allowNumberOnly
maxlength="4"
/>
</div>
<div >
<input
type="text"
placeholder="Written Premium"
formControlName="writtenPremium"
/>
</div>
</div>
</ng-container>
</form>
TS：
public addOpportunityDetails() {
this.opportunitesx.push(this.createOpportunityInformation());
this.isEditValue = this.opportunitesx ? this.opportunitesx.length : 0;
}
演示
uj5u.com熱心網友回復：
您可以為此使用unshift方法。但是它不能直接在formArray. 為此，您需要使用formArray.controls.
public addOpportunityDetails() {
this.opportunitesx.controls.unshift(this.createOpportunityInformation());
this.isEditValue = this.opportunitesx ? this.opportunitesx.length : 0;
}
參考資料：- https://angular.io/api/forms/FormArray
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/431275.html