Javascript 在angularjs中完成写入后触发事件

我想在我的用户在angularjs中完成写入（无需输入）后启动搜索

我的html（简化）：

我的AngularJs（简化）：

$scope.searchControl=function（）{
$scope.search=函数（）{
$http({
方法：“POST”，
url:“”，
“数据：搜索=”+$scope.ajaxSearch，
标题：{
“内容类型”：“应用程序/x-www-form-urlencoded”
}
}).成功（功能（数据）{
$scope.result=数据；
});
}

原始代码很广泛，所以我简化了。 在我的代码中，我总是在用户更改搜索时发布数据。 我想在我的用户停止写入后几秒钟发布数据

---

有什么想法吗？

这可以通过以下指令轻松实现：

angular.module('myApp', [])
.directive('keyboardPoster', function($parse, $timeout){
  var DELAY_TIME_BEFORE_POSTING = 3000;
  return function(scope, elem, attrs) {
    var element = angular.element(elem)[0];
    var currentTimeout = null;

    element.onkeypress = function() {
      var model = $parse(attrs.postFunction);
      var poster = model(scope);
      if(currentTimeout) {
        $timeout.cancel(currentTimeout)
      }
      currentTimeout = $timeout(function(){
        poster();
      }, DELAY_TIME_BEFORE_POSTING)
    }
  }
})
.controller('testController', function($scope){
  $scope.search = function() {
    console.log("Executing query...");
  }
})

它可以像这样使用

<div ng-app='myApp' ng-controller='testController'>
  <input type="text" keyboard-poster post-function="search">
</div>

---

使用

$timeout

并在每次用户键入时取消；如果超时运行，则执行作为attr给定的作用域函数。您可以修改延迟时间，使其更适合您的用户体验（但我不会将其降至

1000

以下）。

这可以通过指令轻松实现：

angular.module('myApp', [])
.directive('keyboardPoster', function($parse, $timeout){
  var DELAY_TIME_BEFORE_POSTING = 3000;
  return function(scope, elem, attrs) {
    var element = angular.element(elem)[0];
    var currentTimeout = null;

    element.onkeypress = function() {
      var model = $parse(attrs.postFunction);
      var poster = model(scope);
      if(currentTimeout) {
        $timeout.cancel(currentTimeout)
      }
      currentTimeout = $timeout(function(){
        poster();
      }, DELAY_TIME_BEFORE_POSTING)
    }
  }
})
.controller('testController', function($scope){
  $scope.search = function() {
    console.log("Executing query...");
  }
})

它可以像这样使用

<div ng-app='myApp' ng-controller='testController'>
  <input type="text" keyboard-poster post-function="search">
</div>

---

使用

$timeout

并在每次用户键入时取消；如果超时运行，则执行作为attr给定的作用域函数。您可以修改延迟时间，使其更适合您的用户体验（但我不会将其降至

1000

以下）.

只是一个小更新-你必须使用

元素。onkeydown

而不是

元素。onkeypress

如果你想处理退格（显然几乎总是必要的），只要一个小更新-如果你想处理退格，你必须使用

元素。onkeydown

而不是

元素。onkeypress

（显然，这几乎总是必要的）