Question

我希望在输入更改时在不同的时间范围内触发某些功能。目前，我有这个：

<input type="text" name="title" ng-model="title" placeholder="Search..." ng-model-options="{ updateOn: 'default blur', debounce: {'default': 3000, 'blur': 0} }" ng-change="showData()"><br>

<div class="loadSpinnerPost" ng-if=".....">
   <div class="bounce1"></div>
   <div class="bounce2"></div>
   <div class="bounce3"></div>
</div>

所以目前，我只实施showData()。 3秒后，此功能搜索新数据。同时，我想展示一个我想在输入更改后直接触发的加载器，我称之为showLoader()。当showData()函数完成时，它应该只使用ng-if禁用加载器。

showLoader()应该在ng-change和showData()之后三秒后触发，但我无法弄清楚如何执行此操作。

到目前为止我尝试过：

我尝试在ng-debounce中使用setTimeout()，而不是使用showData()。但是，这仅在显示数据时延迟，而不是向后端发出较少的请求。
比较输入值与旧输入值。但是，使用title时，模型ng-debounce的值也会在3秒后更新。

Answer 1

您可以使用ng-keypress来显示加载程序并在检索数据时隐藏它。

e.g。 https://plnkr.co/edit/F4pSTdYgdxbEnxm8ds5q?p=preview

对AngularJS中的某些函数进行Ng-debounce

1 个答案: