如何在Ionic 3中获取ion-checkbox多重选择值 [英] How to get ion-checkbox multiple select value in Ionic 3
本文介绍了如何在Ionic 3中获取ion-checkbox多重选择值的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
<div *ngIf="testList.length > 0">
<ion-item *ngFor="let member of testList">
<ion-label>{{member?.testName || 'N/A'}}</ion-label>
<ion-checkbox color="dark" [(ngModel)]="member.checked"></ion-checkbox>
</ion-item>
</div>
[{testID: 1, testName: " test1", testAmount: "500", testDescription: ""},
{testID: 2, testName: " test2", testAmount: "500", testDescription: ""},
{testID: 3, testName: "dgdfgd", testAmount: "150", testDescription: ""},
{testID: 4, testName: "UricAcid", testAmount: "200", testDescription: ""}]
<button (click)="gettstdata()">Done</button>
点击完成按钮后如何获取所有复选框值,如多选
How to get all checkbox value like multi select when click on Done button
推荐答案
<div *ngIf="testList.length > 0">
<ion-item *ngFor="let member of testList">
<ion-label>{{member?.testName || 'N/A'}}</ion-label>
<ion-checkbox color="dark" (click)="selectMember(member)" [(ngModel)]="member.checked"></ion-checkbox>
</ion-item>
</div>
<button ion-button (click)="checkAll()">Done</button>
ts:
testList: any = [
{testID: 1, testName: " test1", checked: false},
{testID: 2, testName: " test2", checked: false},
{testID: 3, testName: "dgdfgd", checked: false},
{testID: 4, testName: "UricAcid", checked: false}
]
selectedArray :any = [];
checkAll(){
for(let i =0; i <= this.testList.length; i++) {
this.testList[i].checked = true;
}
console.log(this.testList);
}
selectMember(data){
if (data.checked == true) {
this.selectedArray.push(data);
} else {
let newArray = this.selectedArray.filter(function(el) {
return el.testID !== data.testID;
});
this.selectedArray = newArray;
}
console.log(this.selectedArray);
}
这篇关于如何在Ionic 3中获取ion-checkbox多重选择值的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文