angular1中，使用$scope.$on(事件名，处理函数)可以接收事件，使用$scope.$broadcast(事件名，数据)或者$scope.$emit(事件名，数据)可以触发事件。那$broadcast和$emit有什么区别呢。他们的区别在于，$broadcast会向下广播事件即只有本身和子controller可以收到这个事件，而$emit向上广播事件，即只有本身和父controller可以收到这个事件。看例子。
<!DOCTYPE html>
<html ng-app="app">
<head>
<title></title>
<script src="//cdn.bootcss.com/angular.js/1.5.8/angular.min.js"></script>
</head>
<body>
<div ng-controller="ctrl1">
<div ng-controller="ctrl2">
<div ng-controller="ctrl3">
</div>
<button ng-click="triggerEmit()">triggerEmit</button>
<button ng-click="triggerBroadcast()">triggerBroadcast</button>
</div>
</div>
<script>
var app = angular.module('app',[]);
app.controller('ctrl1',['$scope',function($scope){
$scope.$on('broadcast',function(){
console.log('ctrl1 get broadcast');
})
$scope.$on('emit',function(){
console.log('ctrl1 get emit')
})
}])
app.controller('ctrl2',['$scope',function($scope){
$scope.$on('broadcast',function(){
console.log('ctrl2 get broadcast');
})
$scope.$on('emit',function(){
console.log('ctrl2 get emit')
})
$scope.triggerBroadcast=function(){
$scope.$broadcast('broadcast');
}
$scope.triggerEmit=function(){
$scope.$emit('emit');
}
}])
app.controller('ctrl3',['$scope',function($scope){
$scope.$on('broadcast',function(){
console.log('ctrl3 get broadcast');
})
$scope.$on('emit',function(){
console.log('ctrl3 get emit')
})
}])
</script>
</body>
</html>
当点击triggerEmit时，会打印出
ctrl2 get emit
ctrl1 get emit
当点击triggerBroadcast时，会打印出
ctrl2 get broadcast
ctrl3 get broadcast
![angular离线部署[图]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)