javascript - как - Отмена текущих запросов Angular $ http при появлении нового запроса



put запрос js (2)

Как отменить текущий Angular $ http-запрос при появлении нового запроса?

У меня есть приложение Angular с обновлением, которое обновляется по типу пользователя. Иногда старые запросы завершаются после последнего запроса, что означает, что представление отображает неверные данные. Какой самый простой способ отменить предыдущий запрос при появлении нового?

Использование Angular 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;
        })
    }

В этом случае, несмотря на то, что я вызываю Canceler.resolve до запроса $ http, этот запрос считается «сбойным».

Есть идеи?

редактировать: решение найдено!

// 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;
        })
    }

https://src-bin.com


Answer #1

Когда вы начинаете новый поиск, вызывайте функцию 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 в ваш контроллер / директиву / сервис.


Answer #2

Решение состоит в том, чтобы настроить обещание, а затем при каждом поиске () отменить его и повторно инициализировать новое. Это надежно отменит все предыдущие $ 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;
    })
}




angularjs