我正在尝试使用MovilizerJS和Ionic Framework来创建
HTML5屏幕.我尝试从Ionic生成的App.js文件中引用te MovilizerJS.我在plugins文件夹中添加了MovilizerJS文件,并添加了包含的Cordova.js文件.
var oHead = document.getElementsByTagName('HEAD').item(0);
var oScript = document.createElement("script");
oScript.type = "text/javascript";
oScript.src = "plugins/Movilizer.js";
oHead.appendChild(oScript);
看来,当我在浏览器中加载HTML5页面(或者在movelet中加载html5视图)时,MovilizerJS不会被加载.浏览器上显示以下错误：
Module ‘movilizer’ is not available!
也许我需要将此作为模块添加到Angular框架中,但是当我尝试将其添加到模块时它仍然给我错误.
我的HTML文件包含movilizer的脚本标记：
<script src="plugins/Movilizer.js"></script>
我的App.js代码目前看起来像这样：
angular.module('starter',['ionic'])
.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
// for form inputs)
if(window.cordova && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
}
if(window.StatusBar) {
StatusBar.styleDefault();
}
});
}).factory('MovilizerExtender',function ($rootScope) {
return {
startUpMovilizer: function(){
movilizer.readGlobalVariable("testTable",this.successCallback,this.errorCallback);
},successCallback: function(result){
$rootScope.routestops = [
{ ontvNaam: 'nice' },{ ontvNaam: 'it' },{ ontvNaam: 'is' },{ ontvNaam: 'working' }
];
},errorCallback: function(){
console.log('Failed');
}
}
}).controller("RoutestopCtrl",function($scope,$rootScope,MovilizerExtender) {
MovilizerExtender.startUpMovilizer();
$scope.routestops = $rootScope.routestops;
$rootScope.$watch('routestops',function(){
$scope.routestops = $rootScope.routestops;
});
});
当我直接调用succesCallback方法并注释行：movilizer.readGlobalVariable(…)时,它不再尝试访问movilizerJS并且页面正常工作.另请注意,Movilizer.js文件包含app.js代码中描述的readGlobalVariable方法.任何帮助或想法将不胜感激.
尝试引导您的应用而不是使用ng-app：
window.onpageshow = ready;
function ready()
{
var deviceready = new Event("deviceready");
document.dispatchEvent(deviceready);
angular.bootstrap(document,['starter'],{strictDi: true});
}
另外,使用承诺等待movilizer：
.factory('MovilizerExtender',function ($q,$rootScope) {
return {
startUpMovilizer: function(){
var self = this;
var defer = $q.defer();
rootScope.$watch(function(value) {
return movilizer && movilizer.readGlobalVariable;
},function(ready) {
if(ready) {
movilizer.readGlobalVariable("testTable",self.successCallback,self.errorCallback);
}
defer.resolve(ready);
});
return defer.promise;
},successCallback: function(result){
$rootScope.routestops = [
{ ontvNaam: 'nice' },{ ontvNaam: 'working' }
];
},errorCallback: function(){
console.log('Failed');
}
}
}).controller("RoutestopCtrl",MovilizerExtender) {
MovilizerExtender.startUpMovilizer().then(function(){
$scope.routestops = $rootScope.routestops;
});
$rootScope.$watch('routestops',function(){
$scope.routestops = $rootScope.routestops;
});
});
