代码如下:
app.directive('myDirective', function() {
return {
scope: {
number: '=',
onClick: '&'
},
template: '<p ng-click="clickMe()">Click Me!</p>',
link: function(scope, ele, attr) {
scope.clickMe = function() {
scope.number++;
// scope.$apply() // 加上这句有用但会抛一个异常:$apply() already in progress
console.log('In Directive: ', scope.number);
scope.onClick();
}
}
}
});
app.controller('mainCtr', function($scope) {
$scope.myNum = 0;
$scope.onClick = function() {
console.log('In controller: ' + $scope.myNum);
};
$scope.$watch('myNum', function(val) {
console.log('In Watch: ' + val);
});
});
html上的代码是这样的:
<p my-directive number="myNum" on-click="onClick()"></p>
我猜想的结果是这样的:
In Watch: 1
In Directive: 1
In controller: 1
但实际结果是这样的:
In Directive: 1
In controller: 0
In Watch: 1
想请教下各位大牛directive双向绑定的数据为什么不是立即更新的?怎么做到能同时更新controller中的数据哩?调用$apply()方法可以更新,但是会报一个异常。除此之外还有什么办法?
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
http://stackoverflow.com/questions/22996096/apply-already-in-progress-with-custom-directive-and-events
写一个延迟吧~
// 貌似angular的绑定需要一定时间,所以scope不是最新值
// 或者这样说,link执行在绑定操作前
// 顺序:scope->controll->compile->link->ngbind->template
在link函数里加一个对scope.number的$watch,将scope.onClick()放入该watch的回调函数中执行。
$scope.$watch('number', function() {
scope.onClick();
});