ionic 图片拍照；选择上传 ngcordova cordovaFileTransfer cordovaCamera

来源：互联网发布：淘宝店铺去掉导航栏编辑：程序博客网时间：2024/05/21 17:03

http://ngcordova.com/docs/plugins/touchID/ 这里面可都是硬货；
添加ngcordova插件；http://ngcordova.com/docs/install/（初始化网址）；
至于不理解这句的bower install ngCordova；自己去初始化（http://bower.io/#install-bower）；网址打不开的，自己翻墙；哥再教你个方法，下个百度浏览器，各种外文技术网站都可以打开的*（什么ionic等，速度很快的，百度这点做的很好，不要告诉别人呀，这是哥的经验）；
下面是代码部分；具体的很；谁要是看不懂别理我了，我想静静：控制器代码：

$scope.picture = function() {        $ionicActionSheet.show({            buttons: [              { text: '相机' },              { text: '图库' }            ],            cancelText: '关闭',            cancel: function() {                return true;            },            buttonClicked: function(index) {                switch (index){                    case 0:                        takePhoto();                        break;                    case 1:                        pickImage();                        break;                    default:                        break;                }                   return true;            }        });    }    //image picker    var pickImage = function () {        var options = {            maximumImagesCount: 1,            width: 800,            height: 800,            quality: 80        };        $cordovaImagePicker.getPictures(options)            .then(function (results) {                $scope.images_list.push(results[0]);                upImage(results[0]);            }, function (error) {                // error getting photos            });    }     var takePhoto = function () {            var options = {                //这些参数可能要配合着使用，比如选择了sourcetype是0，destinationtype要相应的设置                quality: 100,                                            //相片质量0-100                destinationType: Camera.DestinationType.FILE_URI,        //返回类型：DATA_URL= 0，返回作为 base64 編碼字串。 FILE_URI=1，返回影像档的 URI。NATIVE_URI=2，返回图像本机URI (例如，資產庫)                sourceType: Camera.PictureSourceType.CAMERA,             //从哪里选择图片：PHOTOLIBRARY=0，相机拍照=1，SAVEDPHOTOALBUM=2。0和1其实都是本地图库                allowEdit: false,                                        //在选择之前允许修改截图                encodingType: Camera.EncodingType.JPEG,                   //保存的图片格式： JPEG = 0, PNG = 1                targetWidth: 200,                                        //照片宽度                targetHeight: 200,                                       //照片高度                mediaType: 0,                                             //可选媒体类型：圖片=0，只允许选择图片將返回指定DestinationType的参数。 視頻格式=1，允许选择视频，最终返回 FILE_URI。ALLMEDIA= 2，允许所有媒体类型的选择。                cameraDirection: 0,                                       //枪后摄像头类型：Back= 0,Front-facing = 1                popoverOptions: CameraPopoverOptions,                saveToPhotoAlbum: true                                   //保存进手机相册            };            $cordovaCamera.getPicture(options).then(function (imageData) {                CommonJs.AlertPopup(imageData);                var image = document.getElementById('myImage');                image.src = imageData;                upImage(imageData);                //image.src = "data:image/jpeg;base64," + imageData;            }, function (err) {                // error                CommonJs.AlertPopup(err.message);            });        }      //图片上传upImage（图片路径）            //http://ngcordova.com/docs/plugins/fileTransfer/  资料地址            var upImage = function (imageUrl) {                document.addEventListener('deviceready', function () {                    var url = "http://192.168.1.248/api/UserInfo/PostUserHead";                    var options = {};                    $cordovaFileTransfer.upload(url, imageUrl, options)                      .then(function (result) {                          alert(JSON.stringify(result.response));                          alert("success");                          alert(result.message);                      }, function (err) {                          alert(JSON.stringify(err));                          alert(err.message);                          alert("fail");                      }, function (progress) {                          // constant progress updates                      });                }, false);

视图类代码:

<ion-view view-title="Dashboard">  <ion-content class="padding"><button data-ng-click="pay()">支付</button><button data-ng-click="picture()">拍照</button><div class="list">      <div class="item" data-ng-repeat="img in images_list">       <img src="{{img}}"  style="width:100%">      </div>    </div>   </ion-content></ion-view>

对于控制器里面的图片上传；
var url = “http://192.168.1.248/api/UserInfo/PostUserHead“;
var options = {};
$cordovaFileTransfer.upload(url, imageUrl, options)
url :上传路径 imageUrl 图片路径这一点自己看着整吧

最近一直在做混合式开发，各种各样的坑，摸着石头过河，其他方面的问题。也可以留言，我们一块解决，你的问题或许我早就遇到过，什么支付了，resource post 了，post 格式不正确了，哎呀，那叫一个坑挨着一个坑，
偷得半日清闲写这个，希望在代码的路上让我们一路看到希望的曙光；忘记重点了：
源码下载之后；
找到文件所在目录：
执行 ionic platform add android 添加平台
ionic build android 生成apk
你的电脑无法执行，那就是你的配置环境问题了，自己看着整吧；
源码地址：http://download.csdn.net/detail/u012922981/9465765

2 1