webentwicklung-frage-antwort-db.com.de

Ionic 2: Aufrufen einer Methode, wenn der ausgewählte Wert geändert wird

Ich bin neu bei Ionic 2, ich habe die Ionic 2-Dokumentation noch einmal durchgelesen und dachte, dass dieser Code funktionieren würde.

page.html

<ion-select #C ionChange="onChange(C.value)"> 
                    <ion-option value="a">A</ion-option>
                    <ion-option value="b">B</ion-option>
</ion-select>

page.ts

public CValue:String;
onChange(CValue) {
     console.log(CValue);
}

Die Konsole gibt jedoch nichts dazu aus. Habe ich etwas in der Bindung vermisst?

15
CMA

Anstatt

<ion-select #C ionChange="onChange(C.value)"> 
  ...
</ion-select>

Da ionChange ein Ereignis (und kein einfaches Attribut) ist, müssen Sie dies folgendermaßen tun:

<ion-select #C (ionChange)="onChange(C.value)">
  ...
</ion-select>
33
sebaferreras

Anstatt es so zu machen 

<ion-select #C (ionChange)="onChange(C.value)">
  ...
</ion-select>

sie können auch "$ event" übergeben, um den Wert zu erhalten

<ion-select #C (ionChange)="onChange($event)">
  ...
</ion-select>
1
vijay mishra

Für Ionic 4 verwenden

<ion-select [(ngModel)]="c.value" (ngModelChange)="myFun(c.value)">
...
</ion-select>
0
Anuj TBE

Verwenden Sie ionChange in Ionic 4 gemäß Dokumentation

<ion-select formControlName="item" (ionChange)="saveSettings()"><ion-select>

Stellen Sie sicher, dass Sie das emitEvent: false -Eigenschaft in die Patch-Optionen ein, um zu verhindern, dass eine anfängliche Datenmenge das ionChange -Ereignis auslöst.

this.settingsForm.patchValue(data, {emitEvent: false, onlySelf: true})

Zum Zeitpunkt des Schreibens dieses EDITs scheint ion-select das einzige Element zu sein, das beim Patchen der Optionen ausgelöst wird, sodass Sie bei der Initialisierung doppelt speichern können. Beenden Sie dies, indem Sie einen globalen Booleschen Wert festlegen, nach dem Ihre Speicherfunktion sucht, um anzuzeigen, ob die Initialisierung abgeschlossen ist oder nicht. Denken Sie daran, Sie können helfen, Ionic entlang wo Sie müssen! Frameworks sind nur da, um zu helfen, nicht alles!: D Dh:

await this.settings$.subscribe(async data => {
  if(this.initialLoading == 0) {
    console.log('Subscription data initialising...');
    await this.settingsForm.patchValue(data, {
      onlySelf:true,
      emitEvent:false
    });
    this.initialLoading = 1;
  } else {
    console.log('Settings were altered.');
  }
});

async saveSettings() {
  if(this.initialLoading == 1) {
    // your code
  }
}
0
Grant