如何禁用未选中的复选框，选中的复选框可以切换吗? 在 ngFor 循环中 角度 8?

Question

<div id="col-container">
<mat-card id="profile-card" *ngFor="let candidate of obj_users; let i = index;  ">
<img class=" candidates-image" mat-card-image src="{{candidate.photo }}" />
<mat-card-content>
<h3 style="margin-bottom: 8px;"> {{ candidate.firstname }}
{{ candidate.lastname}} </h3>
<!-- <p *ngIf=""> PRESIDENT </p> -->
<p> {{ candidate.position_id }} </p>
<mat-divider [inset]="true"></mat-divider>
<p> {{ candidate.platform }}</p>
<p> {{ candidate.nation }}</p>
<label class="switch">
<input [disabled]="disabledButton" (change)="OnChange($event , i)" id="checkbox" type="checkbox">
<span matRipple id="purecbx">VOTE</span>
</label>
</mat-card-content>
</mat-card>
</div>

Answer 1

您必须在obj_users中添加一个属性作为disabledButton，以便每个候选人都有一个属性disableButton，并且您可以禁用每个buuton并单独检查其雕像

<label class="switch">
<input [disabled]="candidate.disabledButton" (change)="OnChange($event , i)" id="checkbox" type="checkbox">
<span matRipple id="purecbx">VOTE</span>
</label>

若要启用复选框，请将 obj_users disableButton 属性的索引设置为 false，以便用户可以选中和取消选中