如果選中的復選框不等于 Other Contingencies ,我想禁用輸入欄位,因此我的示例代碼下面有多個復選框。
#html代碼
<ul>
<li *ngFor="let contigency of contingencies">
<mat-checkbox
class="checkbox-margin"
color="primary"
(change)="changeCurrentContingencies($event,contigency)"
>
<mat-form-field appearance="fill" *ngIf="contigency.text === 'Other Contingencies'; else text" matInput>
<mat-label>{{contigency.text}}</mat-label>
<input
[disabled]=""
name = "otherContingency"
matInput
[(ngModel)]="dealDispositionFormFields.otherContingency"
>
<span matPrefix *ngIf="dealDispositionFormFields.otherContingency">$</span>
</mat-form-field>
<ng-template #text>
{{contigency.text}}
</ng-template>
</mat-checkbox>
</li>
</ul>
#ts 代碼片段
contingencies = [
{id: 1, text: 'Financing Contigency'},
{id: 2, text: 'Site Plan Approval Contigency'},
{id: 3, text: 'Permit Approval Contingency'},
{id: 4, text: 'Tenant Approval Contingency'},
{id: 5, text: 'Other Contingencies'},
]
changeCurrentContingencies(e:any,rowData:any){
if(e.checked){
this.selectedContingencies.push(rowData);
}else {
this.removeSelectedContingency(rowData);
}
}
uj5u.com熱心網友回復:
這就是你要找的嗎?
<ul>
<li *ngFor="let contigency of contingencies">
<mat-checkbox class="checkbox-margin"
color="primary"
(change)="changeCurrentContingencies($event,contigency)"
#checkbox>
<mat-form-field appearance="fill" *ngIf="contigency.text === 'Other Contingencies'; else text">
<mat-label>{{contigency.text}}</mat-label>
<input [disabled]="checkbox.checked"
name="otherContingency"
matInput
[(ngModel)]="dealDispositionFormFields.otherContingency" />
<span matPrefix *ngIf="dealDispositionFormFields.otherContingency">$</span>
</mat-form-field>
<ng-template #text>
{{contigency.text}}
</ng-template>
</mat-checkbox>
</li>
</ul>
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/372372.html
上一篇:如何輸入來自服務器的不同資料
下一篇:在React專案中匯入函式
