Open the image gallery with Ionic/angularjs - angularjs

Question

How do I access with Ionic/angularjs on the image gallery? I just want to open the image gallery per button click. How is that possible?

Answer 1

You can use the cordova camera plugin
cordova plugin add org.apache.cordova.camera
Plugin Reference:
https://github.com/apache/cordova-plugin-camera
Sample code
$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);
});
};
You need to just set sourceType option to Camera.PictureSourceType.SAVEDPHOTOALBUM

Answer 2

You can get cordova plugin for ImagePicker by using the following link:
http://ngcordova.com/docs/plugins/imagePicker/
Example:
$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);
});
}

Answer 3

Guys at Ionic made this example: https://github.com/driftyco/ionic-example-cordova-camera/blob/master/plugins/org.apache.cordova.camera/doc/index.md
As a second option, you can try with the imagePicker plugin.
Example:
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
});
});