AngularJS:更新一个输入与动态NG-模型上的每个键按压模糊(AngularJS: Updat

2019-08-06 23:20发布

的jsfiddle来演示该问题: http://jsfiddle.net/yoxigen/xxTJc/

我建立一个小的表单编辑对象的所有属性。 对于这一点,我对性的中继器。 每个属性都有其输入:

<ul ng-controller="myController">
   <li ng-repeat="(property, value) in obj">
       <input ng-model="obj[property]"/><span>{{value}}</span>
   </li>
</ul>

,该值它旁边的一个关键是在输入每次按更新正确,但输入失去焦点。 任何想法,这可怎么固定?

Answer 1:

从谷歌论坛 :

问题是,与每一个模型更改对象的NG-重复再生的整个阵列等模糊的输入框。 什么,你需要做的是包装您的字符串对象



Answer 2:

我希望有一种方法来推迟再生,直到我做编辑。

你也许可以做到这一点。 只是使爆炸掉AngularJS事件的自定义指令,并听取“变”来代替。 这里是什么定制指令可能看起来像一个示例:

YourModule.directive('updateModelOnBlur', function() {
  return {
    restrict: 'A',
    require: 'ngModel',
    link: function(scope, elm, attr, ngModelCtrl)
    {
      if(attr.type === 'radio' || attr.type === 'checkbox')
      {
        return;
      }

      // Update model on blur only
      elm.unbind('input').unbind('keydown').unbind('change');
      var updateModel = function()
      {
        scope.$apply(function()
        {
          ngModelCtrl.$setViewValue(elm.val());
        });
      };
      elm.bind('blur', updateModel);

      // Not a textarea
      if(elm[0].nodeName.toLowerCase() !== 'textarea')
      {
        // Update model on ENTER
        elm.bind('keydown', function(e)
        {
          e.which == 13 && updateModel();
        });
      }
    }
  };
});

那么您的输入:

<input type="text" ng-model="foo" update-model-on-blur />


文章来源: AngularJS: Updating an input with a dynamic ng-model blurs on each key press