вручную самозагрузка AngularJS из Кордовы deviceready события

Question

Я использую Кордову 3.3.1-0.4.2 и Угловое 1.2.13

мне нужно вручную самонастройки Угловым как только я получаю «deviceready» события в Кордова.

Я тестирую Nexus 5 с помощью cordova run android, но у меня точно такое же поведение на iPhone.

Чтобы упростить эту проблему, JS работает в глобальной области документа. Сценарии загружаются до закрытия тега </body>.

---

Это работает:

angular.bootstrap(document.getElementById("app"), ["MyApp"]); 

Это не работает:

function init(){ 
    angular.bootstrap(document.getElementById("app"), ["MyApp"]); 
} 

document.addEventListener('deviceready', function() { 
    init(); 
}, true); 

Однако если добавить alert("init") методу инициализации, который показывает, что он работает. Также предупреждение (угловое) и предупреждение (document.getElementById («приложение»)) показывают, что они существуют.

Я не понимаю, почему, поскольку вызов init() вызывается, он не работает при вызове из обратного вызова EventListener, но он работает, если вызван напрямую.

Кажется странным/неинтуитивным.

Кто-нибудь?

Answer 1

Лучшее решение, которое я нашел, это загрузочное устройство как обычно, а затем загрузить Кордову в качестве модуля, который возвращает обещание, которое разрешается, когда устройство готово.

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

Использование:

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

Я поделился самозагрузки проект here on GitHub

Answer 2

1. По данным Кордова deviceready документации, вы должны приложить к deviceready события в случае OnLoad
2. Возможно, вы столкнулись с проблемой заказа библиотеки javascript

Я разместил план решения, с которым я пришел, что не требует отсроченной инициализации через обещания и был протестирован на надежность работы на нескольких эмуляторах и физических устройствах iOS и Android on my blog.

Answer 3

Для тех, кто на самом деле хочет вручную активировать angularjs после события cordova deviceready, следует использовать это. Вы также можете прочитать подробную информацию об этом здесь AngularJS + Cordova (Updated And Even Better!)

'use strict'; 

var CordovaInit = function() { 

var onDeviceReady = function() { 
    receivedEvent('deviceready'); 
}; 

var receivedEvent = function(event) { 
    console.log('Start event received, bootstrapping application setup.'); 
    angular.bootstrap($('body'), ['c3aApp']); // Manually add and boot Angularjs 
}; 

this.bindEvents = function() { 
    document.addEventListener('deviceready', onDeviceReady, false); 
}; 

//If cordova is present, wait for it to initialize, otherwise just try to 
//bootstrap the application. 
if (window.cordova !== undefined) { 
    console.log('Cordova found, wating for device.'); 
    this.bindEvents(); 
} else { 
    console.log('Cordova not found, booting application'); 
    receivedEvent('manual') 
} 
}; 

$(function() { 
console.log('Bootstrapping!'); 
new CordovaInit(); 
}); 

Я лично выбрал этот метод, потому что мне нужно, чтобы получить некоторые данные из БД SQLite на устройстве для Angularjs конфигурации до Angularjs нагрузок и загрузки Angularjs первый, кажется, разорвать мой код ,

Я использую этот метод когда-то сейчас, и все работает хорошо.

// ПОЖАЛУЙСТА, ОБРАЩАЙТЕСЬ С ПОМОЩЬЮ ВАШИХ ФАЙЛОВ .js.