I'm trying to use angularjs into my phonegap app. I have succesfully created the cordova project. And it's working. The "connecting" became 'devicer ready'. All is ok
I followed this way: use angularjs services to detected cordova 'ready' event.
See the code, the problem is at the end of the question
index.html
<!DOCTYPE html> <html ng-app="MyApp"> <head> <meta charset="utf-8" /> <meta name="format-detection" content="telephone=no" /> <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" /> <link rel="stylesheet" type="text/css" href="css/index.css" /> <meta name="msapplication-tap-highlight" content="no" /> <title>Hello World</title> </head> <body ng-controller="MyController"> <div class="app"> <h1>Apache Cordova</h1> <div id="deviceready" class="blink"> <p class="event listening" ng-hide="ready">Connecting to Device</p> <p class="event received" ng-show="ready">Device is Ready</p> </div> </div> <script type="text/javascript" src="cordova.js"></script> <script type="text/javascript" src="js/q.js"></script> <script type="text/javascript" src="js/angular.min.js"></script> <script type="text/javascript" src="js/fsCordova.js"></script> <script type="text/javascript" src="js/app.js"></script> </body> </html> Please notice I removed display: none; from css of .event.received into css file
fsCordova.js
angular.module('fsCordova', []).service('CordovaService', ['$document', '$q', function($document, $q) { var d = $q.defer(), resolved = false; var self = this; this.ready = d.promise; document.addEventListener('deviceready', function() { resolved = true; d.resolve(window.cordova); }); // Check to make sure we didn't miss the // event (just in case) setTimeout(function() { if (!resolved) { if (window.cordova) d.resolve(window.cordova); } }, 3000); }]); app.js
(function(){ var app = angular.module('myApp', ['fsCordova']); app.controller('MyController', function($scope, CordovaService) { this.ready = false; CordovaService.ready.then(function() { this.ready = true; }); }); })(); The problem ? Using the monitor tool of android SDK, I see in the log this error, from angular.ks
Error: $injector:modulerr Module Error Failed to instantiate module MyApp due to: Error: [$injector:nomod] http://errors.angularjs.org/1.2.20/$injector/nomod?p0=MyApp at Error () at file:///android_asset/www/js/angular.min.js:6:450 at file:///android_asset/www/js/angular.min.js:20:466 at file:///android_asset/www/js/angular.min.js:21:469 at file:///android_asset/www/js/angular.min.js:33:267 at Array.forEach (native) at q (file:///android_asset/www/js/angular.min.js:7:280) at e (file:///android_asset/www/js/angular.min.js:33:207) at dc (file:///android_asset/www/js/angular.min.js:36:309) at c (file:///android_asset/www/js/angular.min.js:18:139) I supposed I've a problem with a .js file missing of misspelled, but file names and file path are right.
Help me, please, to debug.
