Question

我有input字段，我想要应用ngChange的变体。

input字段与ajax调用绑定，当用户更改输入时，服务器端将处理数据，但是，我不想经常拨打电话。

假设用户想输入一个真正的字符串，我希望只有在用户完成他要输入的单词后才能进行调用。不过，我不想使用模糊等事件。什么是更好的方法来实现这一点，而不是setTimeout？

Answer 1

在Angular＆gt;中使用ng-model-options 1.3

 <input type="text"
         ng-model="vm.searchTerm"
         ng-change="vm.search(vm.searchTerm)"
         ng-model-options="{debounce: 750}" />

没有ng-model-options - 在标记中：

<input ng-change="inputChanged()">

在后备控制器/范围

中

var inputChangedPromise;
$scope.inputChanged = function(){
    if(inputChangedPromise){
        $timeout.cancel(inputChangedPromise);
    }
    inputChangedPromise = $timeout(taskToDo,1000);
}

然后您的taskToDo只会在1000毫秒无变化后运行。

Answer 2

从Angular 1.3开始，您可以使用Angular ng-model-options指令

<input ng-change="inputChanged()" ng-model-options="{debounce:1000}">

来源：https://stackoverflow.com/a/26356084/1397994

Answer 3

编写自己的指令 - 这只会根据您设置的条件在myText上运行命令

<input my-change-directive type="text ng-model="myText" />

.directive('myChangeDirective',function() {
    return {
        require : 'ngModel',
        link : function($scope,$element,$attrs) {
            var stringTest = function(_string) {
                //test string here, return true
                //if you want to process it
            }
            $element.bind('change',function(e) { 
                if(stringTest($attrs.ngModel) === true) {
                    //make ajax call here
                    //run $scope.$apply() in ajax callback if scope is changed
                }
            });
        }
    }
})

如何在用户完成输入时调用angularjs ngChange处理程序

3 个答案: