也许您可以尝试在其上添加去抖动并忘记按钮。
按照一个不错的去抖动代码的链接来应用由 Lars Gersmann 创建的任何 DOM。您可以在文章末尾查看他的 JSFiddle 示例,了解它是如何工作的。
来自 GitHub 上 AngularJS 项目的 pull request #2129:
此外,ng-update-model-debounce 属性将允许在最后一次触发事件之后推迟实际的模型更新。此功能在单选按钮中不可用。
即 ng-update-model-debounce="500" for 500ms
按照下面的一个很好的方法来了解如何使用 debounce
/**
* uiDebounce service provides a mechanism for creating a wrapper around a function
* that ensures that the wrapped function is not called more frequently than a
* given time interval.
*
* @param {!Function} func The function to be wrapped (debounced)
* @param {number} wait How long between called to func
* @param {Boolean} immediate If true then the function is invoked on the first call to the
* wrapper function, otherwise the call will not happen until after the wait time has expired
* @return {Function} A debounced wrapper around the func function.
*
* @example
* function lookup(id) { ... lookup something ... }
* var debounceLookup = debounce(lookup, 2000, false);
* $scope.doLookup = function(msg) {
* var promise = debounceLookup(msg);
* console.log('called lookup: ', promise);
* promise.then(function(value) {
* console.log('lookup returned:', value);
* });
* };
*/
angular.module('ui.services').factory('uiDebounce', function($timeout, $q) {
return function(func, wait, immediate) {
var timeout;
var deferred = $q.defer();
return function() {
var context = this, args = arguments;
var later = function() {
timeout = null;
if(!immediate) {
deferred.resolve(func.apply(context, args));
deferred = $q.defer();
}
};
var callNow = immediate && !timeout;
if ( timeout ) {
$timeout.cancel(timeout);
}
timeout = $timeout(later, wait);
if (callNow) {
deferred.resolve(func.apply(context,args));
deferred = $q.defer();
}
return deferred.promise;
};
};
});
来源:Github - Angular-UI