Question

您能告诉我为什么在Angular JS中不触发ng-change吗？当我在日期输入字段中键入“ abc”时，它仅触发一次。请告诉我我将如何多次解雇这是我的代码

$scope.changedate =function(){
    console.log('asda')
  }

<li ng-repeat="(key, x) in c">
       <p class="input-group"  ng-if="x.date=='date'">
          <input type="text" ng-change='changedate()' class="form-control" uib-datepicker-popup="{{format}}" ng-model="x.name" is-open="x.opened" datepicker-options="dateOptions" ng-required="true" close-text="Close" alt-input-formats="formats" />
          <span class="input-group-btn">
            <button type="button" class="btn btn-default" ng-click="open1(x)"><i class="glyphicon glyphicon-calendar"></i></button>
          </span>
        </p>
      <input id='{{key}}' ng-if="x.date!='date'"  type="text" ng-model='x.name' value="{{x.name=='abc'?'ddd':'hhh'}}"/>
    </li>

http://plnkr.co/edit/neixp9ZARRAQ33gKSV9u?p=preview 尝试重现此错误

运行应用程序。第一个日期字段为空。我刚刚在其中输入1，然后ng改变了触发状态，然后再次键入内容，则不会触发

Answer 1

因为键入a时模型值变为undefined，键入b时模型值未定义，因此当您键入c时没有任何变化该模型再次为undefined。这就是为什么ng-change不被调用的原因。

来自angularjs文档：

仅当输入更改时才评估ngChange表达式   值会导致将新值提交给模型。

它不会被评估：

如果$ parsers转换管道返回的值具有   自模型以来输入仍然继续无效，则不会更改   如果通过编程方式更改模型，而不是通过   更改为输入值

这是我用于此类Senario的帮助程序指令：

angular.module('viewValueChanged', [])
    .directive('viewValueChanged', viewValueChangedDirective);


function viewValueChangedDirective() {
    return {
        restrict: "A",
        require: 'ngModel',
        link: linkFn
    };

    function linkFn(scope, elem, attrs, ngModel) {
        scope.$watch(function () {
            return ngModel.$viewValue;
        }, function (newValue, oldValue) {
            if (newValue && newValue !== oldValue) {
                scope.$parent.$eval(attrs['viewValueChanged']);
            }
            // in case of user entered invalid value
            if(newValue === null) {
                scope.$parent.$eval(attrs['viewValueChanged']);
            }
        });
    }
}

并像这样使用它：

 <input uib-datepicker-popup view-value-changed="vm.onFieldsChange() />

为什么在Angular JS中不触发ng-change？

1 个答案: