<!DOCTYPE html>
<html lang="en" ng-app="myapp">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="../js/angularjs.js"></script>
<style type="text/css">
body{
font-size: 32px;
}
div{
margin:8px 0px;
}
</style>
</head>
<body>
<div ng-controller="c3_9_p">
<div ng-controller="c3_9_s">
<button ng-click="to_parent()">向父级传播</button>
<button ng-click="to_child()">向子级传播</button>
<div ng-controller="c3_9_c"></div>
</div>
<div ng-controller="c3_9_b"></div>
</div>
</body>
<script>
var app=angular.module('myapp',[]);
app.controller('c3_9_s',function($scope){
$scope.to_parent=function(){
$scope.$emit('event_1',"事件来源于子级");
}
$scope.to_child=function(){
$scope.$broadcast('event_2',"事件来源于父级");
}
});
app.controller('c3_9_p',function($scope){
$scope.$on('event_1',function(event,data){
console.log('在父级中监听',data)
});
$scope.$on('event_2',function(event,data){
console.log('在子级中监听',data)
});
});
app.controller('c3_9_c',function($scope){
$scope.$on('event_1',function(event,data){
console.log('在父级中监听',data)
});
$scope.$on('event_2',function(event,data){
console.log('在子级中监听',data)
});
});
app.controller('c3_9_b',function($scope){
$scope.$on('event_1',function(event,data){
console.log('在父级中监听',data)
});
$scope.$on('event_2',function(event,data){
console.log('在子级中监听',data)
});
})
</script>
</html>