$ emit或$广播从控制器到指令AngularJS的事件

use*_*246 21 javascript angularjs angularjs-directive angularjs-scope

我希望能够在事件发生更改指令显示的内容时通知指令.我知道指令只运行一次,所以我想知道如何做到这一点.我也不确定我是否应该使用$ 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;
      });
    }
  };
}])
Run Code Online (Sandbox Code Playgroud)

我试图这样做但没有发生任何事情,缩略图没有更新,因为该指令已经运行.

sma*_*sma 25

使用$broadcast.这将向子范围广播事件.以下是使用广播从父控制器向指令发送数据的示例:

http://jsfiddle.net/smaye81/q2hbnL5b/6/


rag*_*aga 6

在您的控制器中执行:

$rootScope.$broadcast('PHOTO_UPLOADED', photo);
Run Code Online (Sandbox Code Playgroud)

并在您的指令中,通过获取广播事件

  $rootScope.$on('PHOTO_UPLOADED', function(event, data) {
         thumbnail = data;
      });
Run Code Online (Sandbox Code Playgroud)