同学们在试用angular+ionic开发移动端时,由于安卓和苹果系统的不同,微信和其他浏览器的不同,会出现很多难以解决的bug,下面是我在项目中遇到的一些bug
1、<ion-content class="zkht-callUp-container" overflow-scroll="false"></ion-content>
overflow-scroll="false"遇到安卓上的微信页面会使识别二维码功能失效
解决办法:overflow-scroll="true" 或者删除此属性
2、div设置了overflow-y:scroll;,但是安卓微信版却显示的overflow-y:hidden;的效果,苹果的微信和浏览器以及安卓的自带浏览器都是scroll显示的,唯独安卓微信不行
解决办法:http://www.cnblogs.com/JoannaQ/archive/2013/06/24/3151843.html
3、<ion-content class="zkht-callUp-container" overflow-scroll="true"></ion-content>
如果在a页面设置overflow-scroll="true" ,单独设置此属性会使苹果手机刚进入a页面可以实现滚动,但是a页面跳转到b页面再返回到a页面时滚动失效
如果a页面还有横向滚动,overflow-scroll="false"会导致在安卓系统中横向滚动失效
4、<input type="number">在ios手机中还可以输入非数字
解决办法:<input type="number" onchange="this.value=this.value.replace(/[^0-9.]+/,'');">
如果在angular中遇到此问题,请注意:
<input type="number" onchange="this.value=this.value.replace(/[^0-9.]+/,'');" ng-model="formData.inputVal">
当页面刚加载时,打印formData.inputVal为“”
当输入数字,再删除所有输入内容时,打印formData.inputVal为null
在这里不能使用oninput="this.value=this.value.replace(/[^0-9.]+/,'');"
使用oninput会导致输入非数字+数字时,拿到的输入框值为空
补充: 猜想可能是oninput和onchange的出发机制不同造成的,oninput是在输入是立即触发,onchange是在失去焦点时触发
5、select插件在微信环境下出现无法点击显示下拉框
解决方法: 在select的父元素中加入属性 data-tap-disabled="true"
查看更多关于angular+ionic的兼容性问题的详细内容...