javascript - 我可以使用 _lodash 在 AngularJS 中去抖动或限制监视的 <input> 吗？

Question

我有以下功能可以监视 <input>绑定(bind)到 $scope.id 的字段。每次输入字段值更改时，都会执行监视功能:

$scope.$watch("id", function (id) {

   // code that does something based on $scope.id

});

有没有办法让我对此设置超时或使用 _lodash 去抖动，以便代码当用户更改值时，不会在每次按键时执行。

我想要的是延迟一秒钟，以便在用户停止输入一秒钟后 watch 内的代码块运行。请注意，输入值是随时可能更改的值。例如，如果值为“1”或“10”或“1000”，我需要调用函数。这类似于 Google 中带有建议的搜索框的工作方式。如果用户输入 999，那么我需要调用该函数。如果他删除了一个 9，那么它就是 99，那么我需要调用该函数。

我确实有 _lodash 可用，因此使用它的解决方案可能最适合我的需求。

Answer 1

您可以在 Angular 1.3.0 中使用 ngModelOptions

HTML:

<div ng-controller="Ctrl">
  <form name="userForm">
    Name:
    <input type="text" name="userName"
           ng-model="user.name"
           ng-model-options="{ debounce: 1000 }" />
    <button ng-click="userForm.userName.$rollbackViewValue(); user.name=''">Clear</button><br />
  </form>
  <pre>user.name = <span ng-bind="user.name"></span></pre>
</div>

更多信息:https://docs.angularjs.org/api/ng/directive/ngModelOptions