Switch

ons-switch要素はswitch UIを作ることができます。ons-switchに値を指定する場合には、[value]バインディングを使って値を指定します。

@Component({
  selector: 'app',
  template: `
    <ons-switch [value]="target"></ons-switch>
    `
})
export class AppComponent {
  target: boolean = true;
}

値の変更を補足する

ons-switchの値を補足するには、(change)イベントバインディングを次のように記述します。

@Component({
  selector: 'app',
  template: `
    <div>
      <div><ons-switch [value]="target" (change)="target = $event.target.checked"></ons-switch></div>
      <div>{{target ? 'on' : 'off'}}</div>
    </div>
    `
})
export class AppComponent {
  target: boolean = true;
}