ngCordova error(s) during initialization


#1

When running a hybrid app, I’m getting the following error(s) in the console:

Uncaught Error: [$injector:modulerr] Failed to instantiate module app due to:
Error: [$injector:modulerr] Failed to instantiate module ngCordova due to:
Error: [$injector:modulerr] Failed to instantiate module ngCordova.plugins due to:
Error: [$inj...<omitted>...1) ionic.bundle.js:9109
(anonymous function) ionic.bundle.js:9109
(anonymous function) ionic.bundle.js:12870
forEach ionic.bundle.js:9351
loadModules ionic.bundle.js:12836
createInjector ionic.bundle.js:12776
doBootstrap ionic.bundle.js:10437
bootstrap ionic.bundle.js:10452
angularInit ionic.bundle.js:10365
(anonymous function) ionic.bundle.js:30700
trigger ionic.bundle.js:11570
(anonymous function) ionic.bundle.js:11841
forEach ionic.bundle.js:9351
eventHandler

My ng-cordova.js is:

angular.module('ngCordova', [
  'ngCordova.plugins'
]);
angular.module('ngCordova.plugins.device', [])

.factory('$cordovaDevice', [function () {

  return {
    getDevice: function () {
      return device;
    },

    getCordova: function () {
      return device.cordova;
    },

    getModel: function () {
      return device.model;
    },

    // Waraning: device.name is deprecated as of version 2.3.0. Use device.model instead.
    getName: function () {
      return device.name;
    },

    getPlatform: function () {
      return device.platform;
    },

    getUUID: function () {
      return device.uuid;
    },

    getVersion: function () {
      return device.version;
    }
  }
}]);
angular.module('ngCordova.plugins.keyboard', [])

.factory('$cordovaKeyboard', [function () {

  return {
    hideAccessoryBar: function (bool) {
      return cordova.plugins.Keyboard.hideKeyboardAccessoryBar(bool);
    },

    close: function () {
      return cordova.plugins.Keyboard.close();
    },

    disableScroll: function (bool) {
      return cordova.plugins.Keyboard.disableScroll(bool);
    },

    isVisible: function () {
      return cordova.plugins.Keyboard.isVisible
    }

    //TODO: add support for native.keyboardshow + native.keyboardhide
  }
}]);
angular.module('ngCordova.plugins.splashscreen', [])

.factory('$cordovaSplashscreen', [ function () {

  return {
    hide: function () {
      return navigator.splashscreen.hide();
    },

    show: function () {
      return navigator.splashscreen.show();
    }
  };

}]);

My index.html is starting with:

<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, maximum-scale=1, user-scalable=no"/>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>

    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <script src="lib/ionic/js/ionic.bundle.js"></script>

    <!-- Angular wrappers for cordova -->
    <script src="lib/ng-cordova.js"></script>
    <!-- Needed for Cordova/PhoneGap (will be a 404 during development) -->
    <script src="cordova.js"></script>

    <!-- High resolution display support. -->
    <script src="lib/angular-retina.js"></script>

    <!-- App css file -->
    <link rel="stylesheet" href="styles/app.css">
    <!-- App info file, generated by the build script. -->
    <script src="js/app-info.js"></script>  
    <!-- App main file -->
    <script src="js/app.js"></script>  
</head>

#2

The strange thing is that when I use:

var app = angular.module('app', ['ngCordova.plugins.device', 'ngCordova.plugins.keyboard', 'ngCordova.plugins.splashscreen', 'ionic', 'ngRetina']);

instead of:

var app = angular.module('app', ['ngCordova', 'ionic', 'ngRetina']);

I seem to get rid of the error, and the functionality of ngCordova seems to get available.


#3

this error is caused because your app.module can’t find the package ‘ngCordova.plugins’ so all your need to do is to just delete it from your app.module.

when ever you get this kind of error its because your app can’t find the package listed in the console error.
note: you only need ‘ngCordova’ in your app.module. when you want to use one of their plugins just install them from the nodejs. eg: camera plugin - cordova plugin add org.apache.cordova.camera


#4

I’ve the same error, any solution?


#5

I don’t understand this. What should I delete? ng-cordova.js file?


#6

I solved my problem by adding the full ngCordova.js file, because I was using the custom builder and it have errors…


#7

I have the same problem. I used both full version and custom version with no luck. I am trying to use the splash screen plugin. I get a blank screen whenever including ‘ngCordova’ as a dependency in my app module.


#8

I assume you’ve already fixed this, but are you sure the path in your index.html is pointing to the same place you copied the ngCordova.js file?


#9

This seemed to have fixed the issue for me