[英]Allow only one selection of check while other option disable in Ionic 3
我一直在关注这个解决方案
如何使用ionic 2和angular2从多个复选框中仅选择单个复选框,其工作正常,但问题是
当我选中任何复选框时,其他复选框将被禁用(这是我想要的),但是如果我取消选中同一复选框,则其他复选框仍将保持禁用状态。 取消选中复选框后如何启用它们?
这是我的代码.ts文件
export class list {
checkedIdx = -1;
}
.html文件
<ion-card class="ion-card">
<ion-item *ngFor="let item of options; let i=index">
<ion-label>{{item}}</ion-label>
<ion-checkbox item-left [ngModel]="checkedIdx == i"(ngModelChange)="$event ? checkedIdx = i : checkedIdx = -1" [disabled]="checkedIdx >= 0 && checkedIdx != i"></ion-checkbox>
</ion-item>
</ion-card>
检查 工作堆栈
您的component.html
应该是这样的:〜
<ion-card class="ion-card">
<ion-item *ngFor="let category of categories; let i = index">
<ion-label>{{category.name}}</ion-label>
<ion-checkbox
[disabled]="categories[i].value"
(click)="selection(category.name);">
</ion-checkbox>
</ion-item>
</ion-card>
您的component.ts
可能是这样的:〜
selection(name: string) {
this.categories.forEach(x => {
if (x.name !== name) {
x.value = !x.value
}
})
}
希望这会有所帮助!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.