2016-11-21 1 views
7

J'ai cette bascule ici:Ionic2 valeur get-bascule ionique sur ionChange

<ion-toggle (ionChange)="notify(value)"></ion-toggle> 

Lorsque je clique sur ce que je veux appeler la méthode NOTIFY passer la valeur à bascule par le paramètre. Comment puis-je obtenir la valeur de bascule?

Merci!

+0

essayer notify ($ event) –

+0

puis dans votre fonction 'Notify (événement: any) { console.log (event.target.value); } ' – Ivaro18

Répondre

17

Tout comme vous pouvez le voir dans Ionic2 Docs - Toggle, une meilleure façon de le faire serait de lier la bascule à une propriété de votre composant en utilisant ngModel

Code Composant:

public isToggled: boolean; 

// ... 

constructor(...) { 
    this.isToggled = false; 
} 

public notify() { 
    console.log("Toggled: "+ this.isToggled); 
} 

Vue:

<ion-toggle [(ngModel)]="isToggled" (ionChange)="notify()"></ion-toggle> 

de cette façon, vous n'avez pas besoin d'envoyer le valeur car il est déjà une propriété de votre composant et vous pouvez toujours obtenir la valeur en utilisant this.isToggled

+1

Merci! Cela a fonctionné correctement! – bbcbreno

+1

Merci @sebaferreras, cela a aidé! –

+1

cela fonctionne merci, vous pouvez également supprimer les crochets de [(ngModel)] – Ruben

1

Il existe 2 façons de vérifier.

La première est comme @Chathuranga Silva a suggéré

html

<ion-toggle (ionChange)="notify($event)"></ion-toggle>

ts

notify(event: any) { console.log("toggled: "+event.target.checked); }

deuxième serait quelque chose comme ceci:

html

<ion-toggle (ionChange)="notify()" [checked]="isToggled"></ion-toggle>

ts

var isToggled: boolean = true; 

notify() { 
    console.log("toggled: "+ this.isToggled); 
} 

Lequel vous choisissez est à vous, je vous recommande le second car il sera plus facile de manipuler les bascule dans le constructeur/onInit, et facilite l'utilisation de cette valeur en dehors de la méthode notify().

5

vous pouvez utiliser $ event dans ionChange.

Vue:

<ion-toggle (ionChange)="notify($event)"></ion-toggle> 

contrôleur:

notify(event) 
    { 
    console.log(event.checked); 
    } 
-1

Utilisez cette

<ion-toggle id="availabilityButton" [(ngModel)]="setOffOrnot" 
(ionChange)="setAvailability()"></ion-toggle> 

setAvailability(e) { 
    this.setOffOrnot = ... 
}