我希望能够在事件发生更改指令显示的内容时通知指令。我知道指令只运行一次,所以我想知道如何做到这一点。我也不确定我是否应该使用$ emit或$ broadcast,这是一个控制器的子指令吗?
例如,在我的控制器中,我有:
$rootScope.$emit('PHOTO_UPLOADED', photo);
在我的指令中:
.directive('photo', [function () {
return {
restrict: 'EA',
scope: {user: '='},
replace: true,
template: '<div id="{{user.id}}"></div>',
link: function ($scope, element, attrs) {
var thumbnail = ($scope.user && $scope.user.image)
? $scope.user.image
: '/default.png';
element.css('background-image', 'url(' + thumbnail + ')');
$rootScope.$on('PHOTO_UPLOADED', function(event, data) {
thumbnail = data;
});
}
};
}])
我尝试这样做但没有任何反应,缩略图没有更新,因为该指令已经运行。
答案 0 :(得分:24)
使用$broadcast
。这将向子范围广播事件。以下是使用广播从父控制器向指令发送数据的示例:
答案 1 :(得分:6)
在您的控制器中执行:
$rootScope.$broadcast('PHOTO_UPLOADED', photo);
并在您的指令中,通过
捕获广播事件 $rootScope.$on('PHOTO_UPLOADED', function(event, data) {
thumbnail = data;
});
答案 2 :(得分:3)
您需要确保将$rootScope
传递给您的指令,以便可以注入:
.directive('photo', ['$rootScope', function($rootScope) {
// snip
}]);
将代码的第一行修改为上面的内容,它应该可以正常工作。