Question

我正在使用Ionic3，并希望有一个html元素（ion-toggle和radio-group），如果我点击它，它会触发一个javascript函数。

如下所示，我根据this添加了ng-click属性，但它没有调用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');
  }

Answer 1

ng-click是一个AngularJS（角度1）语法，在Angular＆gt; = 2中不起作用。

ion-radio有ionSelect个输出事件，radio-group有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>

或者：

 <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>

离子离子切换和无线电组点击事件？

1 个答案: