javascript 如何在 Ionic 应用程序中以正确的方式 Deviceready?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/27300583/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to Deviceready in right way in Ionic application?
提问by redrom
I have Cordova and Ionic based mobile application. On the default page which is loaded after the start of the application is need to work with SQLLite plugin.
我有基于 Cordova 和 Ionic 的移动应用程序。在应用程序启动后加载的默认页面上需要使用 SQLLite 插件。
https://github.com/brodysoft/Cordova-SQLitePlugin
https://github.com/brodysoft/Cordova-SQLitePlugin
Problem is that view contains
问题是视图包含
ng-init="setData()"
Which is calling the controller method where is worked with SQL Lite plugin. And because of the the method is called before the deviceready event is not initialized (plugin can be initialized only after deviceready event).
它正在调用与 SQL Lite 插件一起使用的控制器方法。并且因为该方法在没有初始化deviceready事件之前被调用(插件只能在deviceready事件之后被初始化)。
So I tried this workaround:
所以我尝试了这个解决方法:
.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);
db = window.sqlitePlugin.openDatabase({name:"callplanner"});
}
But this not working for me.
但这对我不起作用。
So i tried second solution:
所以我尝试了第二种解决方案:
.factory('cordova', function () {
return {
test: function(){
document.addEventListener("deviceready", this.ready, false);
},
ready: function(){
alert("Ready");
db = window.sqlitePlugin.openDatabase({name:"callplanner"});
}
}
})
and in controller init i tried:
在控制器初始化中我试过:
cordova.test();
But this is not working to (devicereadfy is fired after ng-init).
但这不起作用(在 ng-init 之后触发 devicereadfy)。
After that i found this article:
之后我找到了这篇文章:
http://java.dzone.com/articles/ionic-and-cordovas-deviceready
http://java.dzone.com/articles/ionic-and-cordovas-deviceready
But i did not understand how to put "splash screen" before app is ready and how to set timeout.
但我不明白如何在应用程序准备好之前放置“启动画面”以及如何设置超时。
Have somebody idea how can I solve this problem?
有人知道我该如何解决这个问题吗?
Many Thanks for any advice or help.
非常感谢您的任何建议或帮助。
回答by T4deu
You need to invert this, first you handle the cordova "deviceready" event and then you start the angularjs app. Like this:
您需要反转它,首先处理cordova“deviceready”事件,然后启动angularjs应用程序。像这样:
First remove the the ng-app attribute from the html/body tag
Start the angular app after the devireready:
<script> document.addEventListener('deviceready', function() { angular.bootstrap(document, ['YourAppName']); }, false); var YourAppName = angular.module('YourAppName', []); </script>
首先从 html/body 标签中删除 ng-app 属性
在 devireready 之后启动 angular 应用程序:
<script> document.addEventListener('deviceready', function() { angular.bootstrap(document, ['YourAppName']); }, false); var YourAppName = angular.module('YourAppName', []); </script>
Similar questions:
类似问题:
回答by Del
I couldn't make it work with the @t4deu solution, because my ng-app tag was in the body, so I leave a little change in case that it helps to someone.
我无法使用@t4deu 解决方案使其正常工作,因为我的 ng-app 标签在正文中,所以我留下了一些更改,以防它对某人有所帮助。
<script>
document.addEventListener('deviceready', function() {
angular.bootstrap(document.querySelector('body'), ['starter']);
}, false);
</script>