2017-01-17 24 views
4

私はUSBデバイスを使ってクロームアプリを構築しています。私の主なapp.jsでは、いつデバイスが追加/削除され、URLが変更されたかを常に確認したい。

angular.module('rfApp', [ 
    'ngRoute', 
    'ngMaterial', 
    'rfApp.view1', 
    'rfApp.view2', 
    'rfApp.device_not_found' 
]).config(['$locationProvider', '$routeProvider', function($locationProvider, $routeProvider) { 
    $locationProvider.hashPrefix('!'); 

    function checkForDevices() { 
     RFFWHID.getDevices(function(current_devices) { 
      if(current_devices.length > 0) { 
       $routeProvider.otherwise({redirectTo: '/view1'}); 
      } else { 
       $routeProvider.otherwise({redirectTo: '/device_not_found'}); 
      } 
     }); 
    } 

    chrome.hid.onDeviceAdded.addListener(function(){ 
     checkForDevices(); 
    }); 
    chrome.hid.onDeviceRemoved.addListener(function(){ 
     checkForDevices(); 
    }); 

    checkForDevices(); 

}]); 

ただし、リダイレクトは非同期機能では動作しません。

編集:

私は同様の質問How to call $urlRouterProvider.otherwise() after loading JSON file?を見つけ、最初の答えは、それが不可能であることを説明しています。しかし、どのように私はこの問題を解決することができます。私はusbの削除/グローバルに追加し、それに基づいてビューを変更する必要がありますチェックする必要があります。

答えて

1

私は今、Chromeアプリケーションの環境を持っていないのでデバッグは難しいですが、アプローチを変更することができます。だから、基本的には、デバイスが同期方法で接続されており、あなたがリダイレクトできるかどうかをチェックするたびに状態変化を、

angular.module('rfApp') 
 
.factory('deviceManager', ($rootScope) => { 
 
    let deviceConnected = false; 
 
    
 
    chrome.hid.onDeviceAdded.addListener(function() { 
 
     checkForDevices(); 
 
    }); 
 
    chrome.hid.onDeviceRemoved.addListener(function() { 
 
     checkForDevices(); 
 
    }); 
 

 
    checkForDevices(); 
 
    return { 
 
     isDeviceConnected: isDeviceConnected 
 
    }; 
 

 
    function isDeviceConnected() { 
 
     return deviceConnected; 
 
    } 
 

 
    function checkForDevices() { 
 
     RFFWHID.getDevices(function(current_devices) {    
 
      deviceConnected = current_devices.length > 0; 
 
      $rootScope.$emit('deviceChange'); 
 
     }); 
 
    }  
 
}) 
 
.run(($rootScope, $location, deviceManager) => { 
 
    $rootScope.$on('$routeChangeSuccess', checkAndRedirect); 
 
    $rootScope.$on('deviceChange', checkAndRedirect); 
 

 
    function checkAndRedirect() { 
 
     if (deviceManager.isDeviceConnected()) { 
 
      $location.url('/view1') 
 
     } else { 
 
      $location.url('/device_not_found'); 
 
     } 
 
    } 
 
});

:むしろ$ routeProviderにリダイレクトするよりも、あなたは$ routeChangeSuccessを使用することができますユーザーは$location.urlを使用するか、あなたに最適なものを使用してください。

を編集しました:カスタム$ rootScopeイベントを追加しました。これは、デバイスの接続/切断時に発生します。イベントが発生するたびにアプリケーションが自動的に状態を変更するようになりました。

+0

お返事ありがとうございますが、USBデバイスが追加されました。このif(deviceManager.isDeviceConnected())を実行してからリダイレクトして表示するようにしてください。 – Arti

+0

@Artiデバイスが接続されている'checkForDevices'を実行すると、' RFFWHID.getDevices'を待つことなく、少なくとも1つのデバイスがあれば 'isDeviceConnected'を使って同期をチェックします。 申し訳ありませんが、テストする機会はありませんでした。あなたが従うことができるアプローチのアイデアを教えてください Btw、どうしたらうまくいかないのですか?それを改善することができますか? – pietrovismara

+0

これは '$ rootScope。$ on( '$ routeChangeSuccess '私はURLを変更するときに一度だけ。しかし、私はアプリを実行し、デバイスを削除すると 'chrome.hid.onDeviceRemoved'と私のURL変更する必要があります – Arti