关于ionic的一些坑(3)
(1)对于页面中的input之类的输入框,取值的时候一般采用的是$scope.model=””的方式来取得input输入框的值,然后进行操作,但实际上在ionic里面是取不到的,取值之前必须先把input的值初始化一下才可以,这是因为$scope的作用域问题导致的,例如$scope.inputValue={}这样写,也可以实现input值的初始化
(2)关于ionic的上拉菜单,按照官方文档的写法写出来的上拉菜单,你会发现在ios和android上的样式是不一样的,ios还好,但是android里面的上拉菜单里面的文字内容并没有居中,而是默认的居左显示,具体处理办法是在ionic.css的原文件里面找到一部分代码,并且把他给注释掉就可以了,具体需要注释掉的代码为:
/*.platform-android .action-sheet-backdrop.active {
}
.platform-android .action-sheet {
margin: 0; }
.platform-android .action-sheet .action-sheet-title,
.platform-android .action-sheet .button {
text-align: left;
border-color: transparent;
font-size: 16px;
color: inherit; }
.platform-android .action-sheet .action-sheet-title {
font-size: 14px;
padding: 16px;
color: #666; }
.platform-android .action-sheet .button.active,
.platform-android .action-sheet .button.activated {
background: #e8e8e8; }
.platform-android .action-sheet-group {
margin: 0;
border-radius: 0;
}
.platform-android .action-sheet-cancel {
display: none; }
.platform-android .action-sheet-has-icons .button {
padding-left: 56px; }*/
(3)在ionic开发中难免会用到在主tabs中的某个view继续使用tabs的问题,然而直接使用ion-tabs的话有时会出现路由跳转错乱的问题,在爬坑过程中,各种翻阅资料,大概解决办法归纳下:
我自己在使用的 也是最简单的:views里面的ion-tabs标签外面再加一层div标签,这样可以解决。上面方法都要注意一点就是不管哪个 都不要把tabs()写到content里面,不然会出现导航栏混乱的问题!
(4)在首页引入js文件时,切记
<script src="lib/ngCordova/dist/ng-cordova.js"></script>
<script src="cordova.js"></script>
按照这个顺序来写,必须先把ng-cordova.js写在cordova.js的前面,不能写反了,写反会出现意想不到的问题
(5)在ios的禁用ios自身所带的侧滑返回的功能:
在.config()配置里面写入:
$ionicConfigProvider.views.swipeBackEnabled(false);即可
(6)你会发现你写的数字串在ios上面被解析为了电话号码,数字串的字体为蓝色,并且有下划线,点击可能还会出现拨号,解决办法是在首页中加入此代码即可解决:<meta name="format-detection" content="telephone=no" />
关于ionic的总结
对于在开发中所遇到的坑,暂时想到这么多,在ionic的开发中,看似风平浪静,实则中间有很多难以处理的细节问题需要考虑,也是一步一个脚印慢慢把项目中遇到的坑给踩完,但这也是所遇到的,没有遇到的坑估计还有,这个需要以后在实践应用中继续发掘,然后解决。
关于ionic的一些坑(3)的更多相关文章
- 关于ionic的一些坑(1)
既然来了,总要留下点什么证明自己来过不是,今天就扒一扒自己在ionic上面遇到的坑,因为在项目中2还没出来,所以现在所遇到的都是1中的,关于2的,待老夫以后详细摸索之后在与君细细道来. 1.ionic ...
- 关于ionic的一些坑(2)
如果你通过查阅相关文档,ionic的项目框架已经搭好,下面我来总结一下我在项目中所遇到的坑,给还没踩过的人以方便,给自己以勉励: (1)关于android和ios的适配 因为ionic默认的tabs状 ...
- ionic新入坑-环境搭建+新建项目+打开低版本项目处理
是的.我又双叒叕入新坑了.想我大学的时候web-app刚火起来.还帮忙做了我们学校医务室系统的web-app页面部分呢.时间太紧最后也没出个完整的版本.那时候只是用H5简单做了web部分.是想着用ph ...
- ionic+cordova填坑
1.命令行更新 cordova,ionic.nodejs ,npm,bower等到新版本,不要在vs中更新 2.程序突然白屏 因为拷贝其他程序到js中,乱码 :a模拟器打开 f12看控制台错误解决 3 ...
- Ionic3项目实践记录
Ionic3首次项目实践记录 标签(空格分隔): Angular Ionic Ionic3踩坑 1. 路由懒加载(lazy load) 如果设置了懒加载,就必须全部懒加载(包括TabsPage),否则 ...
- ionic 微信分享值各种坑
去前段时间公司的app需要做微信分享,然后网上找的教程,在做的时候发现网上的教程各种坑,现在将做得过程分享出来 在做功能之前你需要做几步预备工作, 1.安装jdk,jre,并加入全局变量[这个网上还是 ...
- ionic开发遇到的坑及总结
前言 ionic是一个用来开发混合手机应用的,开源的,免费的代码库.可以优化html.css和js的性能,构建高效的应用程序,而且还可以用于构建Sass和AngularJS的优化.ionic会是一个可 ...
- 关于ionic开发中遇到的坑与总结
这次是第二次使用ionic开发混合app,今天算是对这个框架做一个总结,基础的我就不再重复了,网上都有教程.我就说说自己的心得和遇见的各种坑, 之后会陆续补充,想到什么说什么吧. 1.关于ionic效 ...
- ionic中遇到的一些问题和坑
接触ionic有一段时间了,一路上踩了不少坑.大部分都记录下来了,分享给大家,可以少走很多弯路 1,ng-init不能在body里面初始化,可以在一个段落里面初始化<div ng-init> ...
随机推荐
- OC基础:block.字面量
block 块语法,能够用block去保存一段代码,或者封装一段代码. block 实际是由c语言实现的,运行效率非常高. block 实际借鉴了函数指针的语法. block (^)(參数类型1 參数 ...
- using namespace cocos2d;
忘记在头文件添加using namespace cocos2d; 导致一直出现问题,定义的精灵却一直报错. error C2143: 语法错误 : 缺少“;”(在“*”的前面)
- html表格标签与属性
标记: 标 记 说 明 <Table> 表格标记 <Tr> 行标记 <Td> 单元格标记 <Th> 表头标记 <Table>标记属性: ...
- (转)jQuery Validation Plugin客户端表单证验插件
jQuery Validation Plugin客户端表单验证插件 官方文档:http://jqueryvalidation.org/documentation/ 官方demo:http://jque ...
- 记一次lnmp环境下无法执行php文件
lnmp环境搭建好后却无法正常执行php文件,坑爹啊!~ [错误状况] 页面直接打印出php代码内容: php文件无法执行?: 查看nginx配置文件: server { listen 80; ser ...
- 指针 v.s. 引用
对C++的指针总觉得和引用差不多,其实还是挺有差别的. 程序 先看一个小程序: ; int& ra = a; int* pa = &ra; printf("&a = ...
- 为CKEDITOR内容中图片加上 图片服务器路径
做网站的时候,前台和后台是分开的, 用了CKEDITOR上传图片,但是发现内容带图片的时候,前台Web浏览的时候是一个红X,一看路径不对,上传的到数据库中的是相对的虚拟路径,例如:<img al ...
- angular ng-bind-html 对src路径失效 解决方案
json内容 ;<img src="/newsfile/1506271512489.jpg" width="600" height="450&q ...
- php 练习一 5月5日
练习题一:通过登录者找到他的好友并显示在页面上 <title>无标题文档</title> <style type="text/css"> * { ...
- Python 一路走来 DOM & Jquery
DOM 查找: 直接查找 间接查找 —getElementById ...