如何取消AngularJS中的待處理請求？

Question

我有一個輸入欄。當在這個字段上有一個關鍵字時，我發送一個帶有AJAX和角度$ http服務的請求。我的問題是當另一個鍵盤事件觸發時，我需要取消所有未決的請求。我看到很多答案，但我還沒有找到解決方案。

我想兩件事情：

，我稱之爲

App.factory('findArticlesService', function($http, $q) { 
    var self = this; 
    self.canceller = null; 

    return { 
     getArticles: function(route, formData) { 
      if (self.canceller) { 
       self.canceler.resolve("Other request is pending"); 
      } 

      var deferred = $q.defer(); 
      self.canceller = $q.defer(); 

      $http.post(route, angular.toJson(formData), {timeout: self.canceller.promise}).success(function(data) { 
       deferred.resolve({data: data}); 
      }); 

      return deferred.promise; 
     } 
    }; 
}); 

App.controller('mainCtrl', ['$scope', '$http', '$q', 'findArticlesService', function($scope, $http, $q, findArticlesService) { 
    var res = findArticlesService.getArticles(route, $scope.formData); 
    console.log(res); 
}]); 

它不工作所需要的服務。

這：

​​

該取消所有的請求在發送之前。

你能幫我嗎？

Answer 1

由於您註冊的是工廠而不是服務，所以您不必使用「this」，您的函數將不會被視爲/ instanciated作爲構造函數，並帶有新關鍵字。

你需要保持對每個發起請求消除和取消，如果另一發送

App.factory('findArticlesService', function($http, $q) { 
    var canceller; 

    return { 
     getArticles: function(route, formData) { 
      if (canceller) { 
       canceller.resolve("Other request is pending"); 
      } 
      canceller = $q.defer(); 

      return $http.post(route, angular.toJson(formData), {timeout: canceller.promise}); 

     } 
    }; 
}); 

你甚至不需要中介消除，可以使用相同的前一個請求爲消除以前的請求的服務

App.factory('findArticlesService', function($http) { 
    var canceler, 
     getArticles = function (route, formData) { 
     if (canceler) { 
      canceler.resolve('aborted'); 
     } 
     canceler = $http.post(route, angular.toJson(formData), {timeout: canceler.promise}); 
     return canceler; 
     }; 

    return { 
    getArticles: getArticles 
}; 
});