CordovaアプリケーションでngCordovaを使用する

すべての良い一日。



ionicで記述され、Cordovaを使用するアプリケーションがあります。 アプリケーションの本質は、サイトからの情報を表示することです。

複雑なことは何もありません。 インターネットへの依存もあります。 インターネットがある場合は、サイトの最新データを表示し、ない場合は、リリース時にアプリケーションに「ワイヤード」されたデータを出力する必要があります。 それは願いでした。

デバイス上のインターネットの可用性を判断する必要があるときに問題が発生しました。





この記事は、問題に対する唯一の真の解決策ではありません。 これは私の実装です。 より有能な解決策を見つけることができませんでした。 したがって、私の投稿の主なタスクは、問題がどのように実装されたかを示すことであり、他の人のコメント/提案/アドバイスを見て、読むことができます。 それは私自身と他の人の両方を助けます-そのような問題を解決するのに



このアプリケーションは、メイン画面と、セカンダリ画面用の2つのオプションで構成されています。 ルートを変更してページをロードすると、 解決ブロックが実行され 、データを完全に受信してからページが表示されます。



.config(function($stateProvider, $urlRouterProvider) { $stateProvider.state('main', { url: '/', templateUrl : "views/main.html", controller : "MainController", resolve :{ homepageData : function (appService){ return appService.getMainData(); } ... } }); ... });
      
      







最初は、インターネットの状態に関する情報を簡単に取得できるように、通常の変数をtrue |



すべてが完璧に機能しました。 そしてここに最後のコードがあります-インターネットがデバイス上にあるかどうかを調べる必要があります。 私はこの方向での開発経験はありませんが、そうする必要があります! 私はグーグルを始めました。 ngCordovaライブラリを見つけました。これは、おなじみのangle.jsを介してCordova APIとの関係を実装しています。 ルートを処理する段階で、この情報(インターネットについて)が必要です。 しかし、このコードを挿入しようとしても、何も機能しませんでした。 彼らが言ったように:準備ができていないデバイス。



試行の1つの例を次に示します。



 ... .run(function($ionicPlatform, $rootScope, $cordovaNetwork) { $ionicPlatform.ready(function() { if(window.cordova && window.cordova.plugins.Keyboard) { cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); } if(window.StatusBar) { StatusBar.styleDefault(); } //$rootScope.internetAccess = true; $rootScope.internetAccess = $cordovaNetwork.isOnline(); }); });
      
      





そして、私が言ったように:エラーデバイスは準備ができていません。 再びグーグルで、私が見つけたそれらのソリューション(ngCordovaで動作するための)は他のプラグインのためのものであるか、まったく動作しませんでした。 他のプラグインの例を使用する試みは失敗しました。



解決策は、アプリケーションに多くの約束を与えることでした...(:そして、それは機能しました。黄金の山を約束することで、それ(アプリケーション)は私を信じて獲得しました。

約束はこのようなものでした:



解決中:

 ... resolve :{ homepageData : function (appService, $cordovaNetwork){ return appService.getMainData().then(function(data){ return data; }); }, .... } ..
      
      







およびサービスの機能



  angular.module('myModule').factory('appService', function($q, $http, config_data, $injector, $ionicPlatform) { var appData = { getMain : function() { var defer = $q.defer(); $ionicPlatform.ready(function(){ var cordovaNetwork = $injector.get('$cordovaNetwork'); if(!cordovaNetwork.isOnline()){ defer.resolve($http({ method: 'GET', url: config_data.API_HOST + config_data.JSON_PREFIX + 'main.json' }).success(function(data, status, headers, config) { return data; })); }else{ defer.resolve($http({ method: 'GET', url: 'json/' + config_data.JSON_OFFLINE_PREFIX + 'main.json' }).success(function(data, status, headers, config) { return data; })); } }); return defer.promise; }, ... } return appData; });
      
      







このソリューションはおそらく最も美しくて正しいものではないでしょうが、うまくいきます。 他の考えや意見を読みたいです。



All Articles