AngularJS:$ debow debounce

Question

我有以下html代表一个搜索字段:

<input ng-model-options="{ debounce: 500 }" type="text" ng-model="name">

以下是js:

$scope.$watch('name', function(newVal, oldVal) {
            if(newVal != oldVal) {
                $scope.pageChanged($scope.sort, $scope.name, $scope.sortDirection);
            }
        });

现在,我的pageChanged函数对我的服务器进行REST调用,并根据排序和搜索信息("名称")返回一个entites列表.假设我的用户想要搜索"Tom".我想避免我的应用程序进行三次休息调用(name ="T",name ="To",name ="Tom").

我尝试用debounce做这个,但似乎手表不能用去抖动,所以我想知道用最少的代码实现这个的最佳方法是什么？

Answer 1

您应该使用ng-change进行此类操作而不是连接手表.

<input ng-model-options="{ debounce: 500 }" type="text" ng-model="name" ng-change="modelChanged()">

JS:

var timeout = $timeout(function(){});

$scope.modelChanged = function(){
    $timeout.cancel(timeout); //cancel the last timeout
    timeout = $timeout(function(){
        $scope.pageChanged($scope.sort, $scope.name, $scope.sortDirection);
    }, 500);
};

我不熟悉去抖动,但它可能会达到同样的效果.