web-dev-qa-db-ja.com

Ionicアプリケーションで正しい方法でDevicereadyする方法は？

私はCordovaとIonicベースのモバイルアプリケーションを持っています。アプリケーションの開始後にロードされるデフォルトのページでは、SQLLiteプラグインを使用する必要があります。

https://github.com/brodysoft/Cordova-SQLitePlugin

問題は、ビューに含まれていることです

ng-init="setData()"

これは、SQLLiteプラグインで動作するコントローラーメソッドを呼び出しています。また、このメソッドは、devicereadyイベントが初期化されない前に呼び出されるためです（プラグインは、devicereadyイベントの後でのみ初期化できます）。

だから私はこの回避策を試しました：

.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"});
    }

しかし、これは私にはうまくいきません。

だから私は2番目の解決策を試しました：

.factory('cordova', function () {
  return {
      test: function(){
          document.addEventListener("deviceready", this.ready, false);
      },
      ready: function(){
            alert("Ready");
            db = window.sqlitePlugin.openDatabase({name:"callplanner"});
      }

  }
})

そしてコントローラーの初期化で私は試しました：

cordova.test();

しかし、これは機能していません（devicereadfyはng-initの後に起動されます）。

その後、私はこの記事を見つけました：

http://Java.dzone.com/articles/ionic-and-cordovas-deviceready

しかし、アプリの準備が整う前に「スプラッシュ画面」を配置する方法とタイムアウトを設定する方法がわかりませんでした。

誰かがこの問題をどのように解決できるか考えていますか？

アドバイスや助けをありがとう。

javascriptandroidangularjscordovaionic-framework
9
redrom

これを逆にする必要があります。最初にcordovaの「deviceready」イベントを処理してから、angularjsアプリを起動します。このような：

  1. まず、html/bodyタグからng-app属性を削除します

  2. Devirereadyの後にangularアプリを起動します：

    <script>
  document.addEventListener('deviceready', function() { 
    angular.bootstrap(document, ['YourAppName']);
  }, false);
  var YourAppName = angular.module('YourAppName', []);
</script>

同様の質問：

15
T4deu

Ng-appタグが本体にあるため、@ t4deuソリューションで機能させることができませんでした。そのため、誰かに役立つ場合に備えて、少し変更を加えておきます。

  <script>
    document.addEventListener('deviceready', function() {
      angular.bootstrap(document.querySelector('body'), ['starter']);
    }, false);

  </script>
3
Del