【功能介绍】
在开发应用的时候，经常会遇到需要上传图片的功能，比如修改个人资料的头像。本文介绍的是基于ionic框架，在移动端上传图片的功能。
【功能流程】
（1）点击页面上的头像，弹出一个对话框，选择[拍照]或者[从相册选择]；
（2）选取/拍摄照片；
（3）上传照片；
【html核心代码】
<div ng-controller="myCtrl"> <a ng-click="choosePicMenu()"> <img ng-src="{{img}}"> </a> </div>【myCtrl.js核心代码】
（1）选取图片的函数
//定义选择照片的函数，$scope.choosePicMenu = function() {var type = 'gallery'; $ionicActionSheet.show({ buttons: [ { text: '拍照' }, { text: '从相册选择' } ], titleText: '选择照片', cancelText: '取消', cancel: function() { }, buttonClicked: function(index) {if(index == 0){ type = 'camera'; }else if(index == 1){ type = 'gallery'; } //Camera.getPicture(type)->根据选择的“选取图片”的方式进行选取 Camera.getPicture(type).then( //返回一个imageURI，记录了照片的路径function (imageURI) { $scope.me.image = imageURI; //更新页面上的照片 $scope.img = imageURI; $scope.$apply(); },function (err) { });return true; } });};（2）上传函数中的核心代码
//新建文件上传选项，并设置文件key，name，typevar options = new FileUploadOptions();options.fileKey="ffile";options.fileName=$scope.me.image.substr($scope.me.image.lastIndexOf('/')+1);options.mimeType="image/jpeg";//用params保存其他参数，例如昵称，年龄之类var params = {};params['name'] = $scope.me.name;//把params添加到options的params中options.params = params;//新建FileTransfer对象var ft = new FileTransfer();//上传文件ft.upload( $scope.me.image, encodeURI('some url'),//把图片及其他参数发送到这个URL，相当于一个请求，在后台接收图片及其他参数然后处理 uploadSuccess, uploadError, options);//upload成功的话function uploadSuccess(r) {var resp = JSON.parse(r.response);if(resp.status == 0){ //返回前一页面 $navHistory.back(); }else{ $ionicPopup.alert({ title: 'Message', cssClass: 'alert-text', template: 'Upload fail!' }); }}//upload失败的话function uploadError(error) {}扩展：
这里有一篇文章，使用ng-cordova的file transfer插件进行上传和下载->http://santoshshinde2012.blogspot.sg/2015/03/file-upload-download-with-ng-cordova.html
转载于:https://www.cnblogs.com/CheeseZH/p/4756736.html
相关资源：数据结构—成绩单生成器