嘉恩Gavin-优快云博客

原创 ionic实现下载文件并打开功能（file-transfer和file-opener2插件）

作为一款app，下载文件功能，和打开文件功能，在某些场景下还是十分有必要的。使用cordova-plugin-file-transfer和cordova-plugin-file-opener2这两个插件能够在ionic比较容易的实现这个功能。1、安装：cordova plugin add cordova-plugin-file-transfercordova plugin add cordova...

2018-02-12 17:52:08 3444

原创 ionic监听android返回键（实现“再按一次退出”功能）

在android平台上的app，在主页面时经常会遇到“再按一次退出app”的功能，避免只按一下返回键就退出app提升体验优化。1、这个功能需要我们用到ionic提供的registerBackButtonAction方法（注册硬件后退按钮动作）registerBackButtonAction(callback, priority, [actionId])参数类型说明callback functi...

2018-02-12 17:46:08 1649

原创 ionic使用CardIO实现扫描银行卡功能（只能扫描16位以下，并且是浮雕数字）

在一些涉及支付功能的app，一般需要绑定银行卡，除了靠用户手动输入银行卡号，用手机扫描银行卡也是一种常用的手段，查阅了写资料，发现ionic有CardIO插件可以实现这个功能，就兴致冲冲去尝试，结果有些失望。下面介绍一下如何在ionic中使用CardIO实现扫描银行卡功能相关CardIO插件的ngCordova说明1、在入口文件main.js 中const app = angular.module...

2018-02-12 17:42:58 972

原创 ionic1使用imagepicker在安卓手机上闪退问题

在上一篇文章中，提到了如何在ionic1中使用imagepicker插件，并且实现该插件显示中文（汉化）问题有兴趣可以看看：ionic1使用ImagePicker插件并且显示中文（汉化）1、这次要解决的问题是app在一些手机上打开相册时，莫名闪退问题。在上一篇文章中我们这样使用imagepicker插件。通过连接手机联调后，可以查看相关的错误原因error $scope.openImageP...

2018-02-12 17:36:57 1036

原创 ionic1使用ImagePicker插件并且显示中文（汉化）

在使用ionic开发时，打开相册应该是使用比较频繁的插件之一。下面讲讲我在项目中使用（这部分官方比较详细，就简单描述）以及解决插件显示英文问题1、imagepicker安装cordova plugin add cordova-plugin-image-picker2、在ionic1开发中的使用2.1在js文件中angular.module("app").controller("imagePicke...

2018-02-12 17:33:20 2275 1

原创 ionic中实现从相册中选择图片并一次上传多张图片

在开发项目的时候需要在一次请求中能够上传多张图片，本以为使用cordova的相关插件file-transer就能轻松搞定。但是真的想的太简单了，cordova plugin的file-transer一次只能上传一个文件，如果想要用循环的方式，就会再后台产生多条记录显然不是我们需要的。最后翻了很多博客后加上自己调试终于实现。<div class="item row row-wrap">

2017-10-07 16:11:32 2032

原创 ionic实现上拉加载更多（组件 ion-infinite-scroll使用，以及多次加载的问题）

开发过程中需要对展示内容实现上拉加载的更多效果，本来以为实现没有什么难度，ionic本身就提供了ion-infinite-scroll组件能够完成我们的开发需要。先上代码<ion-view view-title="{{i18n.org_member_info_label}}"> <ion-content> <div ng-repeat="item in table.trs" on

2017-10-07 15:23:18 2623 2

原创 ionic之点击放大图片

开发过程中常常会遇到点击展示大图片的需求，只需要ng-if，popover-backdrop(弹出框) 就可以轻松实现。 html：<ion-view> <ion-content> <div class="item item-input-inset"> <img ng-src="{{faceImages.screenImageUrl}}" ng-click="showBig

2017-08-01 22:43:12 2896 1

转载【转】ionicLoading，ionic-spinner SVG旋转加载

原文链接： http://www.cnblogs.com/xuan-0107/p/5120471.htmlionic 加载动作 ionicLoadingionicLoading ionicLoading 是 ionic 默认的一个加载交互效果。里面的内容也是可以在模板里面修改。angular.module('LoadingApp', ['ionic']).controller('Loading

2017-08-01 22:40:54 503

转载【转】ionic之AngularJS手势事件

ionic开发app时，常会用到很多的手势，下面是推荐一篇有关手势的介绍。原文链接： http://www.ionic.ren/2015/12/23/ionic%E4%B9%8Bangularjs%E5%8D%81-%E6%89%8B%E5%8A%BF%E4%BA%8B%E4%BB%B6/1、长按 : on-hold在屏幕同一位置按住超过500ms，将触发on-hold事件：你可以在任何元素上使

2017-08-01 22:35:52 968

转载【转】css样式自动换行（强制换行）

原文链接：http://blog.youkuaiyun.com/ye987987/article/details/8011875自动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容器撑大,挺让人头疼,下面介绍的是CSS如何实现换行的方法对于div,p等块级元素正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的 white-space:normal ,当定义的宽度之后自动换行htm

2017-08-01 22:20:58 945

转载【转】angularJS的兄弟controller之间如何正确的通信

原文链接：http://www.cnblogs.com/webbest/p/5883245.htmlAngularJS中的controller是个函数，用来向视图的作用域（$scope）添加额外的功能，我们用它来给作用域对象设置初始状态，并添加自定义行为。当我们在创建新的控制器时，angularJS会帮我们生成并传递一个新的scope对象给这个controller,在angularJS应用的中的任何

2017-08-01 22:16:16 757

原创 cordova-plugin-app-version插件的使用

开发项目的时候自动更新功能呢，需要获取app的版本，cordova-plugin-app-version可以用来的获取版本号，可以用命令行：cordova plugin add cordova-plugin-app-version，或者在配置文件config.xml、package.json进行配置。 cordova.getAppVersion.getVersionNumber()就可以获取当前的

2017-08-01 22:04:32 4703

转载【转】ng-class的三种用法

原文出处：https://segmentfault.com/a/1190000009139387在开发中我们通常会遇到一种需求：一个元素在不同的状态需要展现不同的样子。而在这所谓的样子当然就是改变其css的属性，而实现能动态的改变其属性值，必然只能是更换其class属性这里有三种方法：第一种：通过数据的双向绑定（不推荐）第二种：通过对象数组第三种：通过key/value下面简单说下这三种：第一种：通

2017-07-31 23:05:20 2013

原创 angular中的ng-repeat-start和ng-repeat-end的用法介绍

ng-repeat-start和ng-repeat-end是angular（1.2.X）的扩展，用于灵活的控制遍历index部分class="item item-input-inset" ng-repeat-start="item in accessoryImg"> class="input-label" ng-bind="i18n.accessory_label">

2017-05-11 14:42:59 1549

原创 angular中$state.go页面跳转并传递参数

遇到一个页面跳转的时候，在跳转后的页面获取跳转前页面的数据,我想到用一种是localstorage，一种用broadcast和on，然后老大说不用这么麻烦，既然都$state.go了直接带参数，这次就介绍一下$state.go页面跳转传递参数。1.路由页面（注意这里要在路由上添加一个参数用于传递数据，不然在页面跳转的时候会filter） .state("home.workpiece",{

2017-05-08 20:59:08 11768

转载【转】ng-if与ng-show区别以及ng-if会创建子作用域问题

上周有个需求是为了对数据进行更好的筛选，需要设置两个浮动框点击后显示的内容分别是各个班组和各个工种，一开始以为是要用两个浮动框，找啊找，找了半天没有找到，然后做成点击不同按钮在同一个浮动框里显示不同的内容，那我自然是想到了ng-if（当时是考虑到不用加载，减少加载？挖了坑自己跳啊）然后用ng-model和filter来进行输入框的筛选显示功能，但是用ng-if把头部head和内容cont

2017-05-08 20:01:46 1299

转载【转】ionic的bar-header移除底部边框

在开发的时候想要达到这样的效果，可是bar-header自带的border-bottom十分讨厌，想要去除，奈何border：none都不管用，最后还是从网上找到了解决方案原答案出处：http://stackoverflow.com/questions/27123773/remove-border-bottom-in-ion-header方法一：添加到自定义css.bar-he

2017-05-08 19:58:40 1392

转载【转】ionic run android 成功launch success，但是genymotion虚拟机没有显示

这个真的是一个要着重强调的坑，网上找了好久才找到方案一：genymotion下载一个google nexus模拟机，用三星的可能不行（真的不是黑，两台电脑三星s7都不行，一台换了nexus就行了）。这是翻墙出去找到的方法方案二：打开genymotion的主页面，点击settings，再点击ADB，选择本地的sdk目录，保存重启ok。（这个方案在另一台电脑上试过，可行）方案二

2017-05-08 19:57:26 1299

原创 ionic的开发环境搭建

大致的开发步骤：安装node.js –安装Apache Cordova -安装Java JDK – 安装Apache Ant - 安装android SDK – 安装cordova和ionic – 安装genymotion（android模拟器）1.1 、安装node.js（为了使用npm来安装ant，cordova，ionic）去node官网下载node（尽量选择新的版本，我这里

2017-05-08 19:55:11 498

Jiaen188的博客