离子离子切换和无线电组点击事件?
Ionic ion-toggle and radio-group click event?
我正在使用 Ionic3,并且想要一个 html 元素 (ion-toggle
and 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');
}
ng-click
是一种 AngularJS (angular 1) 语法,在 Angular >= 2.
中不起作用
ion-radio
has ionSelect
output event and 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>
我正在使用 Ionic3,并且想要一个 html 元素 (ion-toggle
and 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');
}
ng-click
是一种 AngularJS (angular 1) 语法,在 Angular >= 2.
ion-radio
has ionSelect
output event and 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>