Javascript 如何加载。在控制器之前运行,javascript,angularjs,html,cordova,ionic,Javascript,Angularjs,Html,Cordova,Ionic,我正在Cordova中使用预填充的db做一个应用程序,我试图将db搜索的结果放入中,但在我的html文件中没有使用ng click(这是迄今为止我发现的唯一解决问题的方法),我尝试使用ng init,但它在运行之前在我的控制器中执行该函数。我在那里加载我的db,这是代码
app.js
var ionicApp = angular.module('starter', ['ionic', 'ngCordova']);
var db = null;
ionicApp.run(function($io
中,但在我的html文件中没有使用ng click(这是迄今为止我发现的唯一解决问题的方法),我尝试使用ng init,但它在运行之前在我的控制器中执行该函数。我在那里加载我的db,这是代码
app.js
var ionicApp = angular.module('starter', ['ionic', 'ngCordova']);
var db = null;
ionicApp.run(function($ionicPlatform, $cordovaSQLite) {
$ionicPlatform.ready(function() {
if(window.cordova && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
cordova.plugins.Keyboard.disableScroll(true);
}
if(window.StatusBar) {
StatusBar.styleDefault();
}
window.plugins.sqlDB.copy("mydb.db","./plugins/me.rahul.plugins.sqlDB/WWW/sqlDB.js",function() {
db = $cordovaSQLite.openDB("mydb.db");
}, function(error) {
db = $cordovaSQLite.openDB("mydb.db");
});
});
});
ionicApp.controller('first-select', function($scope, $cordovaSQLite){
$scope.options = [];
$scope.select = function () {
var query = "SELECT emp FROM adm_cia";
$cordovaSQLite.execute(db, query,[]).then(function(res){
if(res.rows.length > 0){
var newOptions = [];
for(var i = 0; i < res.rows.length; i++){
var idn = (i+1).toString();
newOptions.push({id: idn, name: res.rows.item(i).emp});
}
$scope.options = newOptions;
} else { }
}, function(error){
});
}
})
var-ionicApp=angular.module('starter',['ionic','ngCordova']);
var-db=null;
运行(函数($ionicPlatform$cordovaSQLite){
$ionicPlatform.ready(函数(){
if(window.cordova&&window.cordova.plugins.Keyboard){
插件键盘hideKeyboardAccessoryBar(真);
插件。键盘。禁用滚动(真);
}
如果(窗口状态栏){
StatusBar.styleDefault();
}
window.plugins.sqlDB.copy(“mydb.db”,”/plugins/me.rahul.plugins.sqlDB/WWW/sqlDB.js),function(){
db=$cordovaSQLite.openDB(“mydb.db”);
},函数(错误){
db=$cordovaSQLite.openDB(“mydb.db”);
});
});
});
ionicApp.controller('first-select',函数($scope,$cordovaSQLite){
$scope.options=[];
$scope.select=函数(){
var query=“从adm\u cia中选择emp”;
$cordovaSQLite.execute(db,query,[]),然后(function(res){
如果(res.rows.length>0){
var newOptions=[];
对于(var i=0;i
还有index.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link rel="stylesheet" href="lib/mobile-angular-ui/dist/css/mobile-angular-ui-base.min.css"/>
<link href="css/style.css" rel="stylesheet">
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="bootstrap/js/bootstrap.min.js"></script>
<script src="js/angular-aside/docs/js/angular.min.js"></script>
<script src="js/angular-route/angular-route.min.js"></script>
<script src="lib/mobile-angular-ui/dist/js/mobile-angular-ui.min.js"></script>
<script src="lib/ionic/js/ionic.bundle.js"></script>
<script src="js/ng-cordova.min.js"></script>
<script src="cordova.js"></script>
<script src="js/app.js"></script>
<title>Login</title>
</head>
<body ng-app="starter" ng-controller="first-select" class="scrollable-content" ng-init="select()">
<form id="login" method="get" action="indice.html">
<div align="justify">
<h1 class="color-letra">Nova Plus mobile</h1>
<div class="form_input">
<input ng-click="select()" type="text" placeHolder="Ususario" name="username" requiered> <!-- this ng-click will be instead of the ng-init and is the only way that it works-->
</div>
<div class="form_input">
<input type="password" placeHolder="Contraseña" name="password" required>
</div>
<div class="form_input" style="margin-bottom : 30px">
<select name="empresas" class="empresas" required>
<option value="">Seleccione empresa</option>
<option value="1">prueba</option>
<option ng-repeat="option in options" value="{{option.id}}">{{option.name}}</option>
</select>
</div>
<div class="centrar">
<button type="submit" id="btn-default">Enviar</button>
</div>
</div>
</form>
</body>
</html>
登录
Nova Plus手机
埃姆普雷萨酒店
普鲁巴
{{option.name}
羡慕
这段代码将首先执行select()函数,然后再打开数据库,其思想是先打开数据库,然后执行select()函数
尊敬。$ionicPlatform.ready
不是在您的ionic应用程序中执行的第一件事。调用$ionicPlatform.ready
函数告诉您cordova API已准备好使用(它是cordova deviceReady事件的包装器)。这意味着Angular将在库加载后立即启动应用程序,而无需等待$ionicPlatform.ready
回调
您可以通过从html正文声明中删除ng app=“starter”
标记来修复此问题,因为这将指示angular立即引导您的应用程序。而是在启动ionic.Platform.ready
并完成所有初始化后手动引导应用程序。这里是一个示例代码
var ionicApp = angular.module('starter', ['ionic']);
ionicApp.controller('first-select', function($scope){
$scope.select = function(){
console.log("controller initialized");
// do your thing
};
})
ionic.Platform.ready(function() {
console.log("device ready!");
// do your db init magic
angular.bootstrap(document.body, ['starter']);
});
这样,“设备就绪”日志将始终在“控制器初始化”日志之前写入控制台,并且将不存在竞争条件
请注意,您不能使用ionicApp模块的run块来引导应用程序,因为run块是在angular引导应用程序之后调用的。因此,如果您没有自动引导它,它将永远不会被调用 这应该已经发生了。您是否复制/粘贴了此代码?因为您的行db=$cordovaSQLite.openDB(mydb.db”);
缺少一个“
。除此之外,这看起来是正确的。我拼错了,但代码中的这里是正确的@matthewpavkovIswindow.plugins.sqlDB.copy
synchronous?看起来函数在回调中,这可能意味着它们是异步的;我不知道为什么它不能打开数据库,但是谢谢你的帮助,真的很有用!