изменить текст, отображаемый при переключении ионной кнопки

Question

Я пытаюсь изменить отображаемый текст, чтобы перейти в автономный режим, когда я переключаю кнопку ионного переключения в моем ионном приложении. Вот мой HTML-код

 <ion-label color="light" *ngIf="!isOnline">Go Online</ion-label>
    <ion-label color="light" *ngIf="isOnline">Go Offline</ion-label>


  <ion-toggle (ionChanges)="updateDriverOnlineStatus($event)" [checked]="isOnline"></ion-toggle>

Вот мой машинописный файл

public isOnline: boolean = false;


updateDriverOnlineStatus($event)
  {
  this.isOnline = !this.isOnline;
  }

Как мне это сделать?

Answer 1

Вы должны изменить название события с ionChanges на ionChange:

<ion-toggle (ionChange)="updateDriverOnlineStatus($event)" [checked]="isOnline"></ion-toggle>

Answer 2

Попробуйте изменить имя события на ionChange вместо ionChanges:

<ion-toggle 
  (ionChange)="updateDriverOnlineStatus($event)" 
  [checked]="isOnline">
</ion-toggle>

Кроме того, вы можете сделать это только с одним:

<ion-label color="light">{{ isOnline ? 'Go Offline' : 'Go Online' }}</ion-label>

Вот Образец StackBlitz для вашей ссылки.