我有一个指令与一个模板
<div> <div ng-repeat="item in items" ng-click="updateModel(item)"> <div>
我的指令声明为:
return { templateUrl: '...',restrict: 'E',require: '^ngModel',scope: { items: '=',ngModel: '=',ngChange: '&' },link: function postLink(scope,element,attrs) { scope.updateModel = function(item) { scope.ngModel = item; scope.ngChange(); } } }
我想在一个项目被点击并且foo的值已经改变时调用ng-change。
也就是说,如果我的指令被实现为:
<my-directive items=items ng-model="foo" ng-change="bar(foo)"></my-directive>
我期望当foo的值已更新时调用bar。
使用上面给出的代码,ngChange被成功调用,但它使用旧值foo而不是新的更新值调用。
解决问题的一种方法是在超时时间内调用ngChange,以便在将来的某个时间点(当foo的值已经更改时)执行它。但是这个解决方案使我松散地控制事情的执行顺序,我认为应该有一个更优雅的解决方案。
我也可以在父作用域中使用一个观察器foo,但这个解决方案并不真正给一个ngChange方法被暗示,我被告知观察者是伟大的内存消费者。
有没有办法使ngChange被同步执行没有超时或观察者?
如果你需要ngModel,你可以在ngModelController上调用$ setViewValue,隐式地评估ng-change。链接函数的第四个参数应该是ngModelCtrl。以下代码将使您的指令的ng更改工作。
link : function(scope,attrs,ngModelCtrl){ scope.updateModel = function(item) { ngModelCtrl.$setViewValue(item); } }
为了使您的解决方案工作,请从myDirective的隔离范围中删除ngChange和ngModel。
这里是一个plunk:http://plnkr.co/edit/UefUzOo88MwOMkpgeX07?p=preview