Cordova Camera - Ionic

Question

I've been looking up for a solution for up to almost 2 days. I'm trying to use the ngCordova Camera plugin.

I'm using the ionic-yeoman framework with AngularJS.

What I did was:

bower install --save ngCordova.

Added ngCordova to my app.module. Installed the cordova camera plugin:

cordova plugin add org.apache.cordova.camera.

My controller:

.controller('profileCtrl', function($scope, myService, $cordovaCamera)
{
  $scope.takePicture = function() {
    var options = { 
        quality : 75, 
        destinationType : Camera.DestinationType.DATA_URL, 
        sourceType : Camera.PictureSourceType.CAMERA, 
        allowEdit : true,
        encodingType: Camera.EncodingType.JPEG,
        targetWidth: 100,
        targetHeight: 100,
        popoverOptions: CameraPopoverOptions,
        saveToPhotoAlbum: false
    };

    $cordovaCamera.getPicture(options).then(function(imageData) {
      // Success! Image data is here
    }, function(err) {
      // An error occured. Show a message to the user
    });
  }

  myService.getFoo().then(function(data) {
   //this will execute when the 
   //AJAX call completes.
   $scope.items = data;
  });
})

And I get this error:ReferenceError: Camera is not defined

When you are on the browser the capabilities of cordova aren't available, just on a deployed app or in the simulator. — e382df99a7950919789725ceeec126, Sep 19 '14 at 05:03

Sunil Lama · Accepted Answer · 2016-03-10T16:46:38.050

If you are serving your app through browser, whatever you use of cordova regarding the usage of device, doesn't work. But, if you are having the problem even after serving your app in emulator or the device itself. Try the following steps.

Firstly, check the cordova plugin lists:

Go to project directory type: cordova plugin lists

see for cordova-plugin-media-capture, cordova-plugin-camera (if these are not in the list, you are simply missing your plugins). Run the command cordova plugin add cordova-plugin-media-capture and cordova plugin add cordova-plugin-camera
If the plugins are there and you are still having the issue of camera is not defined
- cordova plugin rm cordova-plugin-camera
- cordova plugin rm cordova-plugin-media-capture
- ionic platform rm android
- ionic platform add android
- cordova plugin add cordova-plugin-camera
- cordova plugin add cordova-plugin-media-capture

Following must be present in your index.html

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

score 2 · Answer 2 · answered Sep 11 '14 at 07:08

2

You should make sure you include the ng-cordova.js file (from the ngCordova/dist/folder) before the cordova.js file in your html.

answered Sep 11 '14 at 07:08

corvuscorax

5,850
3
30
31

score 0 · Answer 3 · answered Jan 22 '15 at 10:37

make sure you include ngCordova in the controller declaration as well. becoz i had kept my controllers and app.js files seperately and had not included ngCordova in angular.module('xx.controllers', ['ionic','ngCordova']). once i did it my problem was solved and i coul runn the app in genymotion

Chad · Answer 4 · 2015-03-13T15:22:01.380

Just figured this out by analyzing the Ionic Camera example project. You did all of the setup correctly, but you still need to inject it into the controller, like so:

.controller('MyCtrl', function($scope, Camera) {

Note that there is not a dollar sign before Camera. This really should be documented more explicitly.

Also, add this factory if you don't already have it:

.factory('Camera', ['$q', function($q) {

  return {
    getPicture: function(options) {
      var q = $q.defer();

      navigator.camera.getPicture(function(result) {
        // Do any magic you need
        q.resolve(result);
      }, function(err) {
        q.reject(err);
      }, options);

      return q.promise;
    }
  }
}])

Nope, this is called Factory – Mike Nguyen Dec 15 '16 at 20:14 — Mike Nguyen, Dec 15 '16 at 20:14

score 0 · Answer 5 · answered Jan 25 '17 at 17:33

0

just try ionic run browser instead ionic serve

answered Jan 25 '17 at 17:33

Luís Siza Jó

41
4

Cordova Camera - Ionic

5 Answers5

Linked