如何在控制器之前加载.run答案

【问题标题】：How to load the .run before the controller如何在控制器之前加载.run
【发布时间】：2016-04-17 09:28:58
【问题描述】：

我正在使用预填充的数据库在 Cordova 中做一个应用程序，我试图将 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){
  });
 }
})

和 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>

此代码将先执行 select() 函数，然后打开数据库，其思路是先打开数据库，然后执行 select() 函数。

问候。

【问题讨论】：

这应该已经发生了。您是否复制/粘贴了此代码？因为您的行db = $cordovaSQLite.openDB(mydb.db"); 缺少"。除此之外，这看起来是正确的。
我拼错了，但这里的代码是正确的。 @matthewpavkov
window.plugins.sqlDB.copy 是否同步？看起来函数在回调中，这可能意味着它们是异步的。

标签： javascript angularjs html cordova ionic

【解决方案1】：

$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 块来引导您的应用程序，因为在 angular 引导应用程序之后会调用 run 块。因此，如果您没有自动引导它，它将永远不会被调用。

【讨论】：

你是对的，现在我遇到了 $cordovaSQLite.openDB("mydb.db"); 的问题我不知道为什么它不打开数据库，但谢谢你的帮助真的很有用！