ionic2 Angular 2 binden Kontrollkästchen mit einem ngFor in einem Formular

Question

Wie binde ich eine checkerbox mit ngfor in einem Formular

<ion-list *ngSwitchWhen="'contacts'"> 
     <ion-item *ngFor="#contact of contacts"> 
      <ion-label> {{contact.name}}</ion-label> 
      <ion-checkbox checked="false" [(ngModel)]="newMessage.contact"></ion-checkbox> 
      <ion-note item-right> 
       {{contact.cell}} 
      </ion-note> 
     </ion-item> 
    </ion-list> 

Alles geklickt wird oder das Formular zeigt einen Fehler

if (form.valid) { 
    console.log(this.newMessage); 
} 

Answer 1

Sie benötigen einen boolean Feld im contact Objekt den Zustand jedes Kästchen zu halten, die gleiche Art und Weise haben Sie eine name oder eine cell. Sie könnten es beispielsweise checked nennen, und es wird ein true oder false Wert für jeden Kontakt abhängig vom Status des jeweiligen Kontrollkästchens enthalten.

<ion-list *ngSwitchWhen="'contacts'"> 
     <ion-item *ngFor="#contact of contacts"> 
      <ion-label> {{contact.name}}</ion-label> 
      <ion-checkbox checked="false" [(ngModel)]="contact.checked"></ion-checkbox> 
      <ion-note item-right> 
       {{contact.cell}} 
      </ion-note> 
     </ion-item> 
    </ion-list> 

Answer 2

Had Finde den Weg heraus, aber du kannst ein Objekt in einem ngModal hinzufügen. Ich rate, aber das könnte auch für Radioboxen funktionieren, hoffe, dass das jemandem hilft.

<ion-list *ngSwitchWhen="'contacts'"> 
     <ion-item *ngFor="#contact of contacts"> 
      <ion-label> {{contact.name}}</ion-label> 
      <ion-checkbox [(ngModel)]="newMessage[contact.id]"></ion-checkbox> 
      <ion-note item-right> 
       {{contact.cell}} 
      </ion-note> 
     </ion-item> 
    </ion-list>