Поиск запроса к mysql в angularjs с использованием ng-keyup, но $http только через 3 секунды

Question

Я хочу сделать онлайн-поиск в angularjs, используя функцию ng-keyup. Но я полагаю, что некорректно делать запросы к BD при каждом запуске. Итак, как я могу установить таймер, который будет обеспечивать работу службы $http только в том случае, если в последние 3 секунды не было нажатий клавиш?

<input type="text" ng-keyup="search(param.values, param.url)">

JS:

app.controller('searchCtrl', function($scope,$rootScope,$http){
$scope.search = function( values , type) {
    var data={};
    data.values=values;
    data.type=type;
    console.log(data);
    $http.post("search.php", data).then(function success (response) {
            console.log(response.data);
            $rootScope.search_result=response.data;
        },function error (response){
            console.log(response.data);
        }
    );
};
});

Answer 1

Вы могли бы использовать ng-model-options в debounce ваше входное значение, которое будет указывать угловое значение для обновления ng-модели для обновления через определенный промежуток времени. Затем переключитесь на ng-change событие будет иметь больше смысла, чем ng-keyup, Короче говоря, мы используем debounce задержать наш вызов API.

<input type="text" ng-model="value" ng-change="search(param.values, param.url)" 
  ng-model-options="{ debounce: 3000 }"

Answer 2

Ожидание нескольких секунд в поисковом модуле не очень эргономично / удобно для пользователя.

Обычно мы отменяем предыдущий запрос каждый раз, когда пользователь вводит новый символ.

Вы можете сделать это, передав обещание timeout собственность вас $ http запрос.

$http.get(request, {timeout: promise}).then...

Вы инициализируете обещание в начале своей функции поиска:

abort = $q.defer();

Таким образом, каждый раз, когда вызывается функция, вы можете проверить, есть ли обещание, и разрешить его (отменить), прежде чем делать новый запрос.

if(abort) {
  abort.resolve();
}

Проверьте работающий поршень. (и откройте консоль, чтобы увидеть, как запросы отменяются при вводе.)