作者:猿奇
链接:www.greatytc.com/p/9d8c7b7558d8
來源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
1、ion-toggle 点击“开关”:
调用toggleFun方法将toggle值传到ts:
<ion-toggle [(ngModel)]="isToggled" (ionChange)="toggleFun()"></ion-toggle>
ts调用:
public isToggled: boolean;
constructor(...) {
this.isToggled = false;
}
public toggleFun() {
console.log("Toggled: "+ this.isToggled);
}
2、ion-radio 单选及Tab切换:
调用langSelect方法将radio value值传到ts:
<ion-list radio-group [(ngModel)]="langSelect" (ionChange)="langSelect()">
<ion-list-header>
Language
</ion-list-header>
<ion-item>
<ion-label>Javascript</ion-label>
<ion-radio checked="true" value="0"></ion-radio>
</ion-item>
<ion-item>
<ion-label>Java</ion-label>
<ion-radio value="1"></ion-radio>
</ion-item>
<ion-item>
<ion-label>Python</ion-label>
<ion-radio value="2"></ion-radio>
</ion-item>
</ion-list>
<div class="langSelect0" *ngIf="langSelect=='0'">Javascript Cnt</div>
<div class="langSelect1" *ngIf="langSelect=='1'">Java Cnt</div>
<div class="langSelect2" *ngIf="langSelect=='2'">Python Cnt</div>
ts调用:
public langSelect= "0";
public langSelect() {
console.log("langSelect: "+ this.langSelect);
}
ion-toggle、ion-radio、ion-checkbox 等用法都差不多,交互不同进行不同的操作
很久没有更新技术贴了,之前也是赶上公司项目忙得晕头转向,什么小程序、混合开发APP、公众号、管理后台及webApp,七八个项目,也是累得没正形了。。。
呵呵,偷偷透露一句,最近本宝宝换工作了……
发现新兴技术猿们都在简书更贴,我也来啦,Ionic相关的技术问题,会慢慢更新上来,欢迎关注!