新しいリクエストがあったときに継続的な$ httpリクエストをキャンセルする

Question

新しいリクエストがあったときに、継続的な$ httpリクエストをキャンセルするにはどうすればよいですか？

私は更新がユーザーの種類として、ライブビューでの角度のアプリを持っています。最新のリクエストの後に古いリクエストが完了することがあります。つまり、ビューに間違ったデータが表示されることがあります。新しいリクエストがあるときに前のリクエストをキャンセルする最も簡単な方法は何ですか？

角度1.5を使用すると、それは価値があります。私が試してみました

<input ng-model = "query" ng-keyup = "search()"/> 
{{results | json}} 

// In the controller: 
    $scope.search = function(){ 
     $http({ 
      method: "GET", 
      url: "/endpoint.php" 
      params: { 
       query: $scope.query 
      } 
     }).then(function(response){ 
      $scope.results = response.data; 
     }) 
    } 

一つの解決策：このシナリオでは

// In the controller: 
    var canceler = $q.resolve(); // New 
    $scope.search = function(){ 
     canceler.resolve("Canceling old request");  // New 
     $http({ 
      method: "GET", 
      url: "/endpoint.php" 
      params: { 
       query: $scope.query 
      }, 
      timeout: canceler.promise // New 
     }).then(function(response){ 
      $scope.results = response.data; 
     }) 
    } 

、私は$のhttpリクエストの前にcanceler.resolveを呼んでいるにもかかわらずは、要求が「失敗」としてアップになります。

任意の洞察力？

編集：解決策が見つかりました！

// In the controller: 
    var canceler = $q.defer(); 

    $scope.search = function(){ 
     canceler.resolve("cancelled"); // Resolve the previous canceler 
     canceler = $q.defer();  // Important: Create a new canceler! 
             // Otherwise all $http requests made will fail 
     $http({ 
      method: "GET", 
      url: "/endpoint.php" 
      params: { 
       query: $scope.query 
      } 
     }).then(function(response){ 
      $scope.results = response.data; 
     }) 
    } 

Answer 1

解決策は、約束を設定し、各検索（）でそれをキャンセルし、新しいものを再初期化することです。これは確実に以前の$ HTTP（）をキャンセルします：

var canceler = $q.defer(); 

$scope.search = function() { 

    canceler.resolve(); 

    canceler = $q.defer(); 

    $http({ 
     method: "GET", 
     url: "/endpoint.php" 
     params: { 
      query: $scope.query 
     } 
     timeout: canceler.promise 
    }).then(function(response) { 
     $scope.results = response.data; 
    }) 
} 

Answer 2

あなたは新しい検索を開始すると、cancel()関数を呼び出します。 resolved変数を使用して、$httpコールが開始される前に中止しないようにすることができます。このような何か：

var canceler = $q.defer(); 
var resolved = false; 

var cancel = function() { 
    canceler.resolve("http call aborted"); 
}; 

$scope.search = function() { 
    if (resolved) { 
     cancel(); 
    } 

    canceler = $q.defer(); 
    resolved = true; 

    $http({ 
     method: "GET", 
     url: "/endpoint.php" 
     params: { 
      query: $scope.query 
     } 
     timeout: canceler.promise 
    }).then(function(response) { 
     $scope.results = response.data; 
     resolved = false; 
    }) 
} 

があなたのコントローラ/ディレクティブ/サービスで$qを注入することを忘れないでください。