如何在更改模型属性时为AngularJS创建更改指令？

Question

我试图找到一个解决以下问题：

How to create on-change directive for AngularJS?

，我已经成立后，在的jsfiddle它的工作原理答案......但只有当财产被直接连接到$范围。事实上，如果我

1）改变$ scope.strText至$ scope.model.strText 2），并从strText的改变属性值model.strText

不工作了。

这里有HTML代码：

<div ng-controller="MyCtrl"> 
    <input on-change="model.strText"/> 
    <input on-change="model.strText"/> 
    <p>{{model.strText}}</p> 
</div> 

这里有JS代码：

var app=angular.module('myApp', []); 

app.directive('onChange', function() {  
    return { 
     restrict: 'A', 
     scope:{'onChange':'=' }, 
     link: function(scope, elm, attrs) {    
      scope.$watch('onChange', function(nVal) { elm.val(nVal); });    
      elm.bind('blur', function() { 
       var currentValue = elm.val();     
       if(scope.onChange !== currentValue) { 
        scope.$apply(function() { 
         scope.onChange = currentValue; 
        }); 
       } 
      }); 
     } 
    };   
}); 

app.controller('MyCtrl', function($scope) { 
    $scope.model.strText = "Hello"; 
}); 

这里就有了的jsfiddle

http://jsfiddle.net/pmcalabrese/XbJVb/

谢谢你提前。

Answer 1

您的数据源有一些缺陷，因为$scope.model未定义。更改为

app.controller('MyCtrl', function ($scope) { 
    $scope.model = {}; 
    $scope.model.strText = "Hello"; 
});