user1876246 user1876246 - 6 months ago 23
AngularJS Question

$emit or $broadcast an event from a controller to a directive AngularJS

I want to be able to notify a directive when an event happens to change what the directive displays. I know that directives only run once, so I am wondering how I would go about doing this. I am also not sure if I should use $emit or $broadcast, is a directive a child of the controller?

For example, in my controller I have:

$rootScope.$emit('PHOTO_UPLOADED', photo);

And in my directive:

.directive('photo', [function () {
return {
restrict: 'EA',
scope: {user: '='},
replace: true,
template: '<div 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;

I tried to do this but nothing happened, the thumbnail was not updated because the directive already ran.

sma sma

Use $broadcast. That will broadcast events to child scopes. Here is an example of using broadcast to send data to a directive from a parent controller: