如何到控制器之前加载.RUN [英] How to load the .run before the controller

查看:146
本文介绍了如何到控制器之前加载.RUN的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用的是pre-填充数据库做一个应用程序在科尔多瓦,我试图把在数据库搜索结果的<选择>但没有使用在我的HTML文件NG-单击(这是我迄今发现解决问题的唯一途径),我试着用NG-初始化,但它在我的控制器,我所在的.RUN之前执行的功能载入我的分贝,这里是code。

I'm doing an app in Cordova using a pre-populated db, I'm trying to put the result of a db search in a < select > but without using a ng-click in my html file (that is the only way I found so far to solve the problem) I tried with ng-init but it executes the function in my controller before the .run that is where I load my db, here is the code.

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

and the 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>

这code会首先做的select()函数后会打开数据库,这个想法是,它首先打开数据库,并执行select()函数了。

this code will do the select() function first and after it will open the database, the idea is that it first open the database and after do the select() function.

问候。

推荐答案

$ ionicPlatform.ready 是不是首先要在你的应用程序离子执行。在 $ ionicPlatform.ready 函数被调用来告诉你,科尔多瓦的API就可以使用(它是科尔多瓦deviceReady事件的包装)。这意味着,随着库,而无需等待 $ ionicPlatform.ready 回调加载角将尽快启动自举你的应用程序。

$ionicPlatform.ready is not the first thing to be executed in your ionic application. The $ionicPlatform.ready function is called to tell you that the cordova APIs are ready to be used (it is a wrapper for the cordova deviceReady event). This means that Angular will start bootstrapping your app as soon as the library is loaded without waiting for the $ionicPlatform.ready callback.

您可以从您的HTML身体的声明删除 NG-应用=启动器标签,因为这会指示角立即引导您的应用程序解决此问题。而是 ionic.Platform.ready后手动引导应用程序被触发,你做了所有的初始化的。下面的示例code

You can fix this by removing the ng-app="starter" tag from your html body declaration as this instructs angular to immediately bootstrap your application. And instead bootstrap the application manually after ionic.Platform.ready is fired and you have done all of your initialisation. Here a sample code

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

这个方式,设备就绪日志将始终被写入到控制台登录初始化器之前,并不会有竞争条件。

This way, "device ready" log will always be written to the console before "controller initialised" log, and there will be no race conditions.

请注意,你不能使用运行块ionicApp模块来引导你的应用程序,因为运行块被称为角已自举应用程序之后。所以,如果你还没有自动自举它,它永远不会被调用。

Note that you can't use the run block of the ionicApp module to bootstrap your application, because the run block is called after angular has bootstrapped the application. So if you have not bootstrapped it automatically it will never be called.

这篇关于如何到控制器之前加载.RUN的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆