There are use cases on when not to use ReactiveForms. In this case, I have some ion-toggles with versions of a book. I just want to use the value of the toggle in my function and whether is set to false or true.

In mycomponent.component.html I have

<div *ngFor="let bookversion of versions">
   <ion-label>{{bookversion.version}}</ion-label>
  <ion-toggle value="{{bookversion.version}}" (ionChange)="bookOfflineToggle($event)"></ion-toggle>
</div>

How do I get the value directly from the $event? In my component.component.ts file:

  bookOfflineToggle($event: CustomEvent) {
    console.log($event.detail.checked);
    console.log($event.detail.value);
  }

There you go! 

 

 

Saved you some valuable time?

Received 100 so far from 4 kind contributors.