$cordovaImagePicker not working for Ionic-Framework

Question

I am having issues getting the Image Picker ngCordova plugin working in my ionic app. Every time I call the function getPictures() in android (on my device and in the emulator) the app will crash. The function runs on IOS in the emulator, but not on a IOS device. I have tried uninstalling and reinstalling the plugin, and even making an example hello world app to see if there was something from my original project that was messing with it. That, however, has not worked.

I keep getting this TypeError when I call the function getPictures:

[console.error] TypeError: Cannot read property 'getPictures' of undefined

Here is my controller, which I copy and pasted from the website:

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

$scope.getImages = function() {

  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
    });

  }
}])

And my installed plugins:

cordova-plugin-console 1.0.2 "Console"
cordova-plugin-device 1.1.1 "Device"
cordova-plugin-image-picker 1.0.8 "ImagePicker"
cordova-plugin-splashscreen 3.1.0 "Splashscreen"
cordova-plugin-statusbar 2.1.1 "StatusBar"
cordova-plugin-whitelist 1.2.1 "Whitelist"
ionic-plugin-keyboard 1.0.8 "Keyboard"

and I made sure I have ngCordova in my index.html

<script src="lib/ngCordova/dist/ng-cordova.js"></script>
<script src="cordova.js"></script>

What is going wrong?

I have injected ngCordova in to my app.js file. angular.module('starter', ['ionic', 'ngCordova']). — Rarepuppers
I'm trying to reproduce this issue now; I'd recommend trying to make sure your app.js and controllers.js look the same as this: github.com/Jewelbots/ble-demo-app/blob/master/app/scripts/… the error tells me that for whatever reason, the plugin is not loaded. This can happen if you have multiple versions of the plugin installed (Cordova hates that), and it can also happen if you're not deviceReady before trying to use it. As I said, I'll try to reproduce this and let you know how it goes. — George Stocker

Mini Bhati Mini Bhati · Accepted Answer · 2016-09-17T18:51:13

It is possible that your device is not ready while your calling the plugin. Try wrapping your plugin call within the deviceready event of cordova or $ionicPlatform.ready(function() {});. It makes sure that device is fully loaded and the plugin is available before making a call.

document.addEventListener("deviceready", function () {
  $cordovaPlugin.someFunction().then(success, error);
}, false);

Read: ngCordova plugin call

$cordovaImagePicker not working for Ionic-Framework

1 Answers