使用 Ionic/angularjs 打开图片库答案

【问题标题】：Open the image gallery with Ionic/angularjs使用 Ionic/angularjs 打开图片库
【发布时间】：2018-04-11 16:10:33
【问题描述】：

如何在图片库中使用 Ionic/angularjs 访问？我只想通过单击按钮打开图片库。这怎么可能？

【问题讨论】：

标签： angularjs cordova ionic-framework

【解决方案1】：

你可以使用cordova相机插件

cordova 插件添加 org.apache.cordova.camera

插件参考： https://github.com/apache/cordova-plugin-camera

示例代码

$scope.getPhoto = function() {

    var options = {
        quality: 50,
        destinationType: Camera.DestinationType.FILE_URI,
        sourceType: Camera.PictureSourceType.SAVEDPHOTOALBUM,
        mediaType: Camera.MediaType.ALLMEDIA,
        saveToPhotoAlbum: true

    };

    $cordovaCamera.getPicture(options).then(function(imageData) {
        console.log("img URI= " + imageData);        
        //Here you will be getting image data 
    }, function(err) {
        alert("Failed because: " + err);
        console.log('Failed because: ' + err);
    });

};

您只需将 sourceType 选项设置为 Camera.PictureSourceType.SAVEDPHOTOALBUM

【讨论】：

【解决方案2】：

您可以使用以下链接获取 ImagePicker 的 cordova 插件：

http://ngcordova.com/docs/plugins/imagePicker/

例子：

$scope.OpenGallery = function() {
   var options = {
       maximumImagesCount: 1,
       width: 350,
       height: 500,
       quality: 50
   }; 
   $cordovaImagePicker.getPictures(options).then(function (results) {
        console.log(results);
   },function(error) {
        console.log(error);
   });
}

【讨论】：

【解决方案3】：

Ionic 的人举了这个例子：https://github.com/driftyco/ionic-example-cordova-camera/blob/master/plugins/org.apache.cordova.camera/doc/index.md

作为第二种选择，您可以尝试使用imagePicker 插件。

例子：

module.controller('ThisCtrl', function($scope, $cordovaImagePicker) {

  var options = {
   maximumImagesCount: 10,
   width: 800,
   height: 800,
   quality: 80
  };

  $cordovaImagePicker.getPictures(options)
    .then(function (results) {
      for (var i = 0; i < results.length; i++) {
        console.log('Image URI: ' + results[i]);
      }
    }, function(error) {
      // error getting photos
    });
});

【讨论】：