#8 $broadcast $emit $on 自定义事件

$broadcast, $emit和$on用于自定义ANGULAR事件(非DOM事件):

• $broadcast, $emit 用于发布事件， 同时可以携带一些数据
• $on 用于订阅事件，对事件进行处理， 同时可以接收发布者的数据
• 适用范围均可为 $scope 和 $rootScope

#1custom events.jpg

$broadcast

使用$broadcast发布事件有如下特点:

• 方向是: 至上而下
• 从broadcast发布事件所在的作用域开始，一直到子作用域或嵌套作用域
• 不论你是否存在事件处理(即是否订阅事件)都会传播到

#2broadcast.jpg

发布事件的同时可以发送一些数据:

#3broadcast and on.jpg

// 某个controller中, 此处为跟作用域发布事件
// {name: 'James'} 数据
$rootScope.$broadcast('customEvent', {name: 'James'})

// 某个子作用域订阅事件
// data 即为事件携带的数据
$scope.$on('customEvent', function(e, data)) {
    var name = data.name;
    // ...
}

$emit

这个和$broadcast发布事件类似，最大的不同就是它传播的方向:

• 方向：至下而上
• 从emit所在的作用域开始，然后到其父作用域，一直往上，知道$rootScope
• 不论是否订阅事件，都会一路emit

#4emit.jpg