The best solution I've found is to bootstrap Angular as normal and then load Cordova as a module that returns a promise, which is resolved when the device is ready.
angular.module('fsCordova', [])
.service('CordovaService', ['$document', '$timeout', '$window', '$q',
function($document, $timeout, $window, $q) {
var defer = $q.defer();
this.ready = defer.promise;
// Backup in the case that we did not received the event
// This seemed to be necessary with some versions of Cordova
// when testing via 'cordova serve' in a web browser
// but when on-device the event is received correctly
var timoutPromise = $timeout(function() {
if ($window.cordova){
defer.resolve($window.cordova);
} else {
defer.reject("Cordova failed to load");
}
}, 1200);
angular.element($document)[0].addEventListener('deviceready', function() {
$timeout.cancel(timoutPromise);
defer.resolve($window.cordova);
});
}
]);
Usage:
angular.module('app', ['fsCordova']).
run(['$window', function($window){
// init Fastclick
FastClick.attach(angular.element($window.document.body)[0]);
}]).
controller('AppCtrl', ['$scope', 'CordovaService',
function($scope, CordovaService){
$scope.ready = false;
// when cordova is ready
CordovaService.ready.then(
function resolved(resp) {
$scope.ready = true;
},
function rejected(resp){
throw new Error(resp);
}
);
}
]);
I've shared this bootstrap project here on GitHub