角度のあるサーバー側でイベントが発生するのを待ちます。

Question

私は実際にangularJSを新しくしました。角度JSがイベントがサーバー側で発生するのを待つページを開発する必要があります。角度JSは2秒ごとに$ http呼び出しを使用してサーバーをチェックし続ける必要があります。そのイベントが完了すると、Angularはサーバーへの$ http呼び出しを再度呼び出すべきではありません。

私は別の方法を試してみましたが、それは私に「最後の5回の反復で焼成ウォッチャー：[]」のようなエラーが与え

私はそれを行う方法を教えてくださいを。続き

はあなたの例$ scope.pageIsReadyでは私のコード

HTML

<div ng-controller="myController"> 
    <div id="divOnTop" ng-show="!isEventDone()"> 
     <div class="render"></div> 
    </div> 
</div> 

角度JS

var ngApp = angular.module("ngApp",[]); 
ngApp.controller('myController', function ($scope, $http) { 
    $scope.ready = false; 
    $scope.isEventDone = function() { 
     $scope.ready = $scope.getData(); 
     return $scope.ready; 
    }; 
    $scope.getData = function() { 
     if (! $scope.ready) { 
      $http.get("/EventManager/IsEventDone") 
      .then(function (response) { 
       $scope.ready = Boolean(response.data); 
      }); 
     } 
    }; 
    setInterval($scope.isPageReady, 5000); 
}); 

Answer 1

で存在していません。

var timeoutInstance = $timeout(function(){ 
    $http.get("/EventManager/IsEventDone") 
       .then(function (response) { 
        $scope.ready = Boolean(response.data); 

        if($scope.ready){ 
         $timeout.cancel(timeoutInstance); 
        else 
         $scope.getData(); 
    } 

       }); 
    },5000); 

が呼び出されてからタイムアウトを停止しますキャンセル：何あなたができることはあなたのコントローラに$タイムアウトサービスを注入し、その中にあなたのHTTP呼び出しをラップしています。私はこれをテストしていないが、それらの行に沿っているべきである。

また

ない、使用しているバックエンドの種類がわからしかし、それはあなたがそれの準備ができ、したがって、あなたは、もはやポーリングを使用する必要があるときに、サーバー側は、フロントエンドに伝えるように、ソケットを使用していますSignalRに見ることができる.NETの場合。

Answer 2

ここにはいくつかのものがあります。

私はです。確信していません受け入れられた答えが実際に動作し、初期の問題を解決しません。だから、私はここで私の2セントを分かち合うつもりです。

$scope.ready = $scope.getData();は、このメソッドは何も返さないため、毎回$scope.ready~undefinedと設定します。したがって、ng-show="!isEventDone()"は常にDOMを表示します。

角度の短いポーリングには、setIntervalの代わりに、角度の$intervalを使用する必要があります。

また、私はいくつかの冗長性をリファクタリングしました。

var ngApp = angular.module("ngApp",[]); 

    ngApp.controller('myController', function ($scope, $http, $interval) { 

     var intervalPromise = $interval($scope.getData, 5000); 

     $scope.getData = function() { 
      if (! $scope.isEventDone) { 
       $http 
        .get("/EventManager/IsEventDone") 
        .then(function (response) { 
         $scope.isEventDone = Boolean(response.data); 
         if($scope.isEventDone) { 
          $interval.cancel(intervalPromise); 
         } 
       }); 
      } 
      else { 
       $interval.cancel(intervalPromise); 
      } 
     }; 

    }); 

これは最初の問題を解決して解決するはずです。ただし、サーバーの負荷が高く、応答に3秒かかるシナリオがあります。この場合、前のリクエストが開始されてから5秒間待っていて、前のリクエストが終了してから待っていないため、2秒ごとにサーバーを呼び出すことになります。

より良い解決策は、asyncのような非同期メソッドを簡単に処理するモジュールを使用することです。 $timeoutとの組み合わせ：

var ngApp = angular.module("ngApp",[]); 

    ngApp.controller('myController', function ($scope, $http, $timeout) { 

     var getData = function(cb){ 
      if(!$scope.isEventDone) return cb(); 
      $http.get("/EventManager/IsEventDone") 
      .then(function (response) { 
       $scope.isEventDone = Boolean(response.data); 
       cb(); 
      }); 
     }; 

     // do during will run getData at least once 
     async.doDuring(getData, function test(err, cb) { 
      // asynchronous test method to see if loop should still occur 
      // call callback 5 seconds after getData has responded 
      // instead of counting 5 seconds after getData initiated the request 
      $timeout(function(){ 
       cb(null, !$scope.isEventDone); 
       // if second param is true, call `getData()` again otherwise, end the loop 
      }, 5000); 

     }, function(err) { 
      console.log(err); 
      // if you're here, either error has occurred or 
      // the loop has ended with `$scope.isEventDone = true` 
     }); 


    }); 

要求が終了した後にこれはタイムアウトを呼び出します。

サーバーを制御している場合は、長時間ポーリングを有効にするwebsocketを使用することをお勧めします（サーバーは頻繁に要求を行うクライアントではなくクライアントに通知します）。クライアントは成長する。

私はこれが役立つことを望みます。