Mehrere Ionen-Toggle schaltet nicht separat

Question

Ich war eine ionische App erstellen, wo ich einen Kippschalter benötigt, um separat gesteuert werden. Aber leider schaltet mein Code alle Schalter zusammen, wenn man einen Schalter anklopft. Kann das gelöst werden und jeder Toggle individuell gesteuert werden?

app.ts Datei

toggleSwitch(switchName) { 
    console.log(switchName + ' toggled'); 
    console.log('Toggle value=' + this.toggleValue); 
    } 

app.html Datei

<ion-row> 
     <ion-col> 
      <ion-list> 
      <ion-item *ngFor="let switch of switches"> 
       <ion-label>Switch Name: {{switch.Switch.name}}</ion-label> 
       <ion-toggle [(ngModel)]="toggleValue" (ionChange)="toggleSwitch(switch.Switch.name)"></ion-toggle> 
      </ion-item> 
      </ion-list> 
     </ion-col> 
     </ion-row> 

Answer 1

Alle Ihre ion-toggle in Die Schleife ist an dieselbe Variable gebunden: toggleValue. Wegen der Zwei-Wege-Bindung wird sich eine Änderung in allem widerspiegeln.

Je nachdem, wie Sie die Daten speichern möchten, haben Sie entweder den Wert im ursprünglichen switch Array oder in einem separaten Array und legen Sie ihn in ngModel fest.

<ion-toggle [(ngModel)]="switch.value" (ionChange)="toggleSwitch(switch.Switch.name)"></ion-toggle>