ng-blur模型的更新值在事件中不可用

时间:2015-02-28 00:56:34

标签: angularjs

我正在使用ng-model-options来防止我的文本输入模型被更新,直到焦点丢失。那部分都有效。但是,我需要在文本输入失去焦点并更新模型后处理事件。在那种情况下,我需要访问新模型的更新值,而不是旧模型。

我正在尝试使用ng-blur事件,但是,在我的处理程序中,值是旧值,而不是输入的新值。我做错了什么或者在文本输入失去焦点后是否有更好的方法来获取新提交的模型值?

<input type="text"
ng-model-options="{ updateOn: 'blur', debounce:0 }"
ng-model="vm.myModel.amount"
ng-blur="vm.handleBlurEvent(vm.myModel.amount)" />


vm.handleBlurEvent = function(item)
{
            //alert(item.amount); //Old amount - not new amount entered
}

5 个答案:

答案 0 :(得分:16)

这是user1750537之前的响应重新设计,延迟模型更新直到控制模糊,然后处理更改一次,不需要去抖动,模型值将按照预期更改逻辑之前设置。 / p>

<input type="text"
ng-model-options="{ updateOn: 'blur' }"
ng-model="vm.myModel.amount"
ng-change="vm.handleChangeEvent(vm.myModel.amount)" />

vm.handleChangeEvent = function(item)
{
   alert(item.amount); //new shows the NEW amount :-)
}

答案 1 :(得分:4)

我没有更好的去除辩论

但要使你的工作在这里是代码

<form name="amountForm" >
     <input type="text" name="amount"
     ng-model-options="{ updateOn: 'blur', debounce:0 }"
     ng-model="vm.myModel.amount"
     ng-blur="vm.handleBlurEvent()" />
</form>

vm.handleBlurEvent = function()
{
     alert($scope.amountForm.amount.$viewValue);
}

...享受

答案 2 :(得分:3)

感谢您的建议。我实际上通过在ng-model-options的updateOn属性中添加1个选项来设法实现此功能。通过添加'默认'一切都有效!

ng-model-options =“{updateOn:'默认模糊}”就是诀窍。

<input type="text"
ng-model-options="{ updateOn: 'default blur' }"
ng-model="vm.myModel.amount"
ng-blur="vm.handleBlurEvent(vm.myModel.amount)" />


vm.handleBlurEvent = function(item)
{
            //alert(item.amount); //new shows the NEW amount :-)
}

答案 3 :(得分:1)

旧问题,但我发现了另一种读取此值的方法,我无法通过延迟消除去抖,对我有用的是使用超时:

  $timeout(function(){
    var amount = this.formName.amount.value;
  });

我认为这是上面代码中的ngModelController。

答案 4 :(得分:0)

使用手表怎么样?

您可以在模型更新后执行逻辑:

 $scope.$watch('vm.myModel.amount', function (newVal, oldVal) {
        if (newVal != oldVal) {
         //do your logic here.
        }
    }, true);