我有個問題。我第一次嘗試根據金額選擇一個復選框。我為此應用了[檢查]功能。但在那之后（更改）不起作用你知道為什么嗎？
這是 html 的代碼：
<mat-radio-group (change)="radioButtonOnChange($event)" formControlName="anticipatedPaymentOrInstallmentAdvance">
<td td-data-table-cell>
<mat-radio-button id='anticipatedPayment' value="ANTICIPATED_PAYMENT" [checked]="isTwiceInstallment()">
{{ 'Anticipated Payment' | translate }}
</mat-radio-button>
</td>
<td td-data-table-cell>
<mat-radio-button id='installmentAdvance' value="INSTALLMENT_ADVANCE" [checked]="!isTwiceInstallment()" [disabled]="disableInstallmentAdvance">
{{ 'Installment Advance' | translate }}
</mat-radio-button>
</td>
</mat-radio-group>
這是 TS 的代碼
isTwiceInstallment() {
const overPaidAmount = this.transactionTotal - this.nextPayment;
const isOverPaid = overPaidAmount > 0.00;
const isTwoTimesInstallment = this.transactionTotal >= (2 * this.nextPayment);
if (isTwoTimesInstallment && isOverPaid) {
this.form.get('anticipatedPaymentOrInstallmentAdvance').setValue('ANTICIPATED_PAYMENT');
this.disableAnticipatedPaymentDropDown = false;
return true;
} else {
this.form.get('anticipatedPaymentOrInstallmentAdvance').setValue('INSTALLMENT_ADVANCE');
this.disableAnticipatedPaymentDropDown = true;
return false;
}
}
radioButtonOnChange(event: any) {
if (event.value === 'ANTICIPATED_PAYMENT' ) {
this.disableAnticipatedPaymentDropDown = false;
this.form.get('anticipatedPaymentOrInstallmentAdvance').setValue(event.value);
}
if (event.value === 'INSTALLMENT_ADVANCE') {
this.disableAnticipatedPaymentDropDown = true;
this.form.get('anticipatedPaymentOrInstallmentAdvance').setValue(event.value);
}
}
uj5u.com熱心網友回復：
isTwiceInstallment()當您在模板中擁有它時，您的函式會不斷被呼叫，因此您似乎無法更改值，因為它基本上會覆寫您正在嘗試執行的操作。不要在模板中呼叫該函式（無論如何都不推薦在模板中呼叫函式，因為它們會影響性能......），只需isTwiceInstallment()在適當的時間（在構建表單之后？）進行檢查，呼叫isTwiceInstallment一次并將其保留在那。然后您的更改事件將正常作業。
所以像這樣的事情......
buildForm() {
// build your form first here...
isTwiceInstallment() // call function after that...
}
并從模板中洗掉函式呼叫。
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/342749.html
上一篇：如何更新子級中父級的物件資料