title: $emit or $broadcast an event from a controller to a directive AngularJS
body: <p>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?</p>
  
  <p>For example, in my controller I have:</p>
  
  <p><code>$rootScope.$emit('PHOTO_UPLOADED', photo);</code></p>
  
  <p>And in my directive:</p>
  
  <pre><code>.directive('photo', [function () {
    return {
      restrict: 'EA',
      scope: {user: '='},
      replace: true,
      template: '&lt;div id="{{user.id}}"&gt;&lt;/div&gt;',
      link: function ($scope, element, attrs) {
        var thumbnail = ($scope.user &amp;&amp; $scope.user.image) 
          ? $scope.user.image
          : '/default.png';
  
        element.css('background-image', 'url(' + thumbnail + ')');
  
        $rootScope.$on('PHOTO_UPLOADED', function(event, data) {
           thumbnail = data;
        });
      }
    };
  }])
  </code></pre>
  
  <p>I tried to do this but nothing happened, the thumbnail was not updated because the directive already ran.</p>