Как я могу выбрать все флажки, когда я проверяю контакты в моем случае? !!ионный 2 - PullRequest
0 голосов
/ 29 мая 2018

  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>

Я пытался выбрать все свои флажки, используя selectAll и checkIfAllSelected (), но это не работает. В моем .TS у меня есть только groupedContacts, который имеет массив изгрупп.У вас есть идея, чтобы решить мою проблему ?!спасибо

Ответы [ 2 ]

0 голосов
/ 29 мая 2018

Я думаю, что одним из решений может быть следующее:

Здесь вы зацикливаетесь: *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>

Таким образом, вы можете инициализировать массив все в true, возможно, когда вызывается эта функцияcheckIfAllSelected (), и результатом будут все выбранные флажки.

Затем вы можете изменить значения массива.

Я надеюсь, что это может помочь вам, но ему нужен этот массив. Извините также за мой английский

0 голосов
/ 29 мая 2018

Кто-то уже спросил некоторых, связанных с тем, что вы просили, чтобы увидеть его нажмите здесь

Следующий код взят из одного из Ответов, который был задан как правильный:

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);
}
});

Надеюсь, это поможет!

...