使用 ionic 和 ngCordova 从相机/图库中捕获/上传答案

【问题标题】：Capture/upload from camera/gallery using ionic and ngCordova使用 ionic 和 ngCordova 从相机/图库中捕获/上传
【发布时间】：2015-12-23 12:32:24
【问题描述】：

我正在尝试创建一个示例应用程序，该应用程序将通过相机拍摄照片或从屏幕上的图库中加载图像。

有人可以帮助我吗？

【问题讨论】：

标签： ionic ngcordova

【解决方案1】：

您可以使用ngCordova 中的$cordovaCamera 拍照并保存。

在app.js中注册ngCordova作为依赖：

angular.module('starter', ['ionic', 'starter.controllers', 'ngCordova'])

controller.js：

.controller('PhotosCtrl', function($scope, $cordovaCamera) {
  /**
   * Add a photo.
   */
  $scope.addPhoto = function(){
    var options = {
      quality: 50,
      destinationType: Camera.DestinationType.DATA_URL,
      sourceType: Camera.PictureSourceType.CAMERA,
      allowEdit: true,
      encodingType: Camera.EncodingType.JPEG,
      targetWidth: 100,
      targetHeight: 100,
      popoverOptions: CameraPopoverOptions,
      saveToPhotoAlbum: false,
      correctOrientation:true
    };

    $cordovaCamera.getPicture(options).then(function(imageData) {
      var image = document.getElementById('myImage');
      image.src = "data:image/jpeg;base64," + imageData;
    }, function(err) {
      console.log("Error while getting the image!", err)
    });
  };
});

template.html：

<ion-view view-title="Photos">
  <ion-content>
    <button type="button" class="button" ng-click="addPhoto()">Add photo</button>
    <img id="myImage" />
  </ion-content>
</ion-view>

【讨论】：