通过 true 或 false 更改具有变量值的 ion-toggle 视觉切换

Question

I thought I had this done but no.

Somehow I can't make to change the toggling of my ion-toggle visual value, with a variable number.

I start my app with my variable at a false state, but my ion-toggle starts actively.

<ion-toggle
  checked="loyaltyCardActiveState"
  [ngModel]="loyaltyCardActiveState"
  (click)="activeLoyaltyCard()"
></ion-toggle>

loyaltyCardActiveState is false at the start, but the toggle is active. What I am doing wrong?

Answer 1

You are using one way binding to your [ngModel]

Please change it to [(ngModel)] It'll change toggling visual value.

Let me know if it works

Answer 2

use ionChange event:

`<ion-toggle
  checked="loyaltyCardActiveState"
  [ngModel]="loyaltyCardActiveState"
  (ionChange)="activeLoyaltyCard()"
></ion-toggle>`

Answer 3

`<ion-toggle [checked]="loyaltyCardActiveState" (ionChange)="loyaltyCardActiveState? loyaltyCardActiveState=false: loyaltyCardActiveState =true"

`