当我检查我的 Ionic 2 案例中的联系人时，如何选择所有复选框?!!

Question

selectAll() {
for (var i = 0; i < this.groupedContacts.length; i++) {
for(var j = 0; j < this.groupedContacts[i].length; j++)
this.groupedContacts[i][j].selected = this.selectedAll;
}
}
checkIfAllSelected() {
for(var i = 0; i < this.groupedContacts.length; i++){
this.groupedContacts[i].every(function(item:any){
let toast = this.toastCtrl.create({
message: item.selected == true,
duration: 3000,
position: 'bottom'
});
return  item.selected == true;
})
}
}

synchroContactSelected() {

<ion-checkbox [(ngModel)]="selectedAll" (ionChange)="selectAll()" >contacts</ion-checkbox>
<ion-item-group *ngFor="let group of groupedContacts">
<!-- alphabet
<ion-item-divider id="scroll-letter-{{group.letter}}" light>{{group.letter}}</ion-item-divider>
-->
<ion-item *ngFor="let cont of group.contacts;" text-wrap>
<ion-label> {{cont.prenom_user}} {{cont.nom_user}}
<p *ngIf="cont.mobile_perso != ''"> {{cont.mobile_perso | phone }}
<br *ngIf="cont.email_perso != ''" /> {{cont.email_perso}}
</p>
<p *ngIf="cont.mobile_pro != '' && cont.mobile_perso == '' "> {{cont.mobile_pro | phone }}
<br *ngIf="cont.email_pro != ''" /> {{cont.email_pro}}
</p>
<p *ngIf="cont.tel_domicile != '' && cont.mobile_pro == '' && cont.mobile_perso == '' "> {{cont.tel_domicile | phone }} </p>
<p *ngIf="cont.tel_pro != '' && cont.tel_domicile == '' && cont.mobile_pro == '' && cont.mobile_perso == '' "> {{cont.tel_pro | phone }} </p>
</ion-label> 

<ion-checkbox [(ngModel)]="cont.selected" (ionChange)="synchronizeContact(cont, $event)" (ionChange)="checkIfAllSelected()"  ></ion-checkbox>
</ion-item>
</ion-item-group>
</ion-col>

我试图使用选择全部和检查如果全部选择((来选择我的所有复选框，但它不起作用 在我的.TS i刚刚分组了具有一系列组的联系人。 你有什么 idéa 可以重新解决我的问题吗？！谢谢

Answer 1

我认为一种解决方案可能是这样的：

在这里，您循环播放：*ngFor="let cont of group.contacts;"被捕获的联系人，您可以在：*ngFor="let cont of group.contacts;let i = index"中编辑此内容。 然后在你的.ts中创建一个布尔数组(group.contacts.length(。此数组是选中复选框的数组，然后在这里：

<ion-checkbox [(ngModel)]="cont.selected" (ionChange)="synchronizeContact(cont, $event)" (ionChange)="checkIfAllSelected()"  ></ion-checkbox>

添加选中的

<ion-checkbox [(ngModel)]="cont.selected" (ionChange)="synchronizeContact(cont, $event);checkIfAllSelected()" [checked]="myBoolArr[i]" ></ion-checkbox>

因此，当此功能称为 checkIfAllSelected(( 时，您可以将数组全部初始化为 true，结果将是选中所有复选框。

然后，您可以更改数组值。

我希望这可以帮助您，但它需要这个数组。也对不起我的英语

Answer 2

有人已经问了一些与你问过的问题相关的问题，要查看它，请单击此处

以下代码来自给出的答案之一：

.HTML：

<label><input type="checkbox" name="sample" class="selectall"/> Select all</label>
<div id="checkboxlist">
<label><input type="checkbox" name="sample[]"/>checkbox1</label><br />
<label><input type="checkbox" name="sample[]"/>checkbox2</label><br />
<label><input type="checkbox" name="sample[]"/>checkbox3</label><br />
<label><input type="checkbox" name="sample[]"/>checkbox4</label><br />
</div>

JavaScript：

$('.selectall').click(function() {
if ($(this).is(':checked')) {
$('div input').attr('checked', true);
} else {
$('div input').attr('checked', false);
}
});

希望对您有所帮助！