Ионный ионный переключатель и событие щелчка радио-группы?

Я использую Ionic3 и хочу иметь элемент html (ion-toggle и radio-group), что если я нажимаю, запускается функция javascript .

Как вы можете видеть ниже, я добавил атрибут ng-click на основе this, но не вызывает функцию javascript.

Любые советы приветствуются.

settings.html

<ion-list>
  <ion-item ng-click="notifications()">
    <ion-label>Notifications</ion-label>
    <ion-toggle [(ngModel)]="personModel.notifications" id="notifications">Notifications</ion-toggle>
  </ion-item>
</ion-list>

<br>

<ion-list radio-group [(ngModel)]="personModel.milesKm" id="milesKm">
  <ion-item ng-click="milesKm()">
    <ion-label>Km</ion-label>
    <ion-radio value="0"></ion-radio>
  </ion-item>
  <ion-item ng-click="milesKm()">
    <ion-label>Miles</ion-label>
    <ion-radio value="1"></ion-radio>
  </ion-item>
</ion-list>

settings.ts

  notifications(): void {
    alert('notifications');
  }

  milesKm(): void {
    alert('milesKm');
  }

ionic-framework angular ionic3 ionic2
person Richard    schedule 05.05.2017    source источник

Ответы (1)


arrow_upward
2
arrow_downward

ng-click является синтаксисом AngularJS (angular 1) и не будет работать в Angular> = 2.

ion-radio имеет ionSelect событие вывода и _ 4_ имеет ionChange событие.

Итак, вы можете:

<ion-list radio-group [(ngModel)]="personModel.milesKm" id="milesKm">
  <ion-item>
    <ion-label>Km</ion-label>
    <ion-radio value="0" (ionSelect)="milesKm()"></ion-radio>
  </ion-item>
  <ion-item ng-click="milesKm()">
    <ion-label>Miles</ion-label>
    <ion-radio value="1" (ionSelect)="milesKm()"></ion-radio>
  </ion-item>
</ion-list>

Or :

 <ion-list radio-group [(ngModel)]="personModel.milesKm" id="milesKm" (ionChange)="milesKm()">
  <ion-item>
    <ion-label>Km</ion-label>
    <ion-radio value="0"></ion-radio>
  </ion-item>
  <ion-item ng-click="milesKm()">
    <ion-label>Miles</ion-label>
    <ion-radio value="1"></ion-radio>
  </ion-item>
</ion-list>

Или ion-item имеет простое событие click.

<ion-list radio-group [(ngModel)]="personModel.milesKm" id="milesKm">
  <ion-item (click)="milesKm()">
    <ion-label>Km</ion-label>
    <ion-radio value="0"></ion-radio>
  </ion-item>
  <ion-item (click)="milesKm()">
    <ion-label>Miles</ion-label>
    <ion-radio value="1"></ion-radio>
  </ion-item>
</ion-list>
person Suraj Rao    schedule 05.05.2017