如何取消AngularJS中ng-model-options的去抖动

时间:2015-09-06 09:06:29

标签: angularjs validation angularjs-ng-model debouncing angularjs-forms

<form name="editForm">
    Title<input ng-model="task.title" type="text" name=taskTitle ng-model-options="{ updateOn: 'default' ,debounce{'default':2000000} }">
    <a ng-click="UpdateTask(task.title)">SAVE</a>
    <a ng-click="editForm.$rollbackViewValue();">DISCARD</a>
</form>

由于去抖动值非常长,当我点击&#34; DISCARD&#34;时,ng-model不会反映其变化。

但是,我想要的是当我点击&#34; SAVE&#34;时,我可以更改去抖动值或使其过期,以便立即反映更改。

我无法在AngularJs文档中找到cancelDebounce(),有人想提供解决方案吗?感谢

2 个答案:

答案 0 :(得分:1)

我建议你有一个范围变量,它具有像$scope.myDebounce = 2000000这样的去抖动值,然后在控制器内部创建一个discard函数,首先将be-bounce值重置为0,然后回滚表单更改。在下一个摘要周期中将myDebounce变量重置为其实际值。

<强>标记

<form name="editForm">
    Title
    <input ng-model="task.title" 
           type="text" 
           name=taskTitle 
           ng-model-options="{ updateOn: 'default', debounce: {'default': myDebounce } }">
    <a ng-click="UpdateTask(task.title)">SAVE</a>
    <a ng-click="editForm.$rollbackViewValue();">DISCARD</a>
</form>

<强>代码

$scope.myDebounce = 2000000; //somewhere in controller

$scope.discard = function (form) {
   $scope.myDebounce = 0; //resetting debounce to get quick `ng-model` update
   form.$rollbackViewValue(); 
   $timeout(function(){
       //setting the actual debounce value to old one in next digest
       $scope.myDebounce = 2000000; 
   });
}

答案 1 :(得分:1)

我认为你真正需要的是NgModelController。$ commitViewValue();

来自angular doc

  

$ commitViewValue()   提交$ modelValue的挂起更新。   debounced事件可能正在等待更新,或者因为输入正在等待ng-model-options中定义的某个未来事件。很少需要这个方法,因为NgModelController通常会在响应输入事件时调用它。