<!doctype html> <html ng-app="app"> <head> <Meta charset="utf-8"> <script src="./angular-1.5.8/angular.js"></script> </head> <body> <div ng-controller="ParentCtrl"> <div ng-controller="SelfCtrl"> <a ng-click="click($event)">click me</a> <div ng-controller="ChildCtrl"></div> </div> <div ng-controller="BroCtrl"></div> </div> </body> </html> <script> var phonecatControllers = angular.module('app',[]); phonecatControllers.controller('SelfCtrl',function($scope) { $scope.click = function () { $scope.$broadcast('to-child','child'); $scope.$emit('to-parent','parent'); } $scope.$on('to-parent',function(event,data) { console.log('SelfCtrl to-parent',data); //父级能得到值 }); $scope.$on('to-child',data) { console.log('SelfCtrl to-child',data); //父级能得到值 }); }); phonecatControllers.controller('ParentCtrl',function($scope) { $scope.$on('to-parent',data) { console.log('ParentCtrl to-parent',data) { console.log('ParentCtrl to-child',data); //子级得不到值 }); }); phonecatControllers.controller('ChildCtrl',function($scope){ $scope.$on('to-child',data) { console.log('ChildCtrl to-child',data); //子级能得到值 }); $scope.$on('to-parent',data) { console.log('ChildCtrl to-parent',data); //父级得不到值 }); }); phonecatControllers.controller('BroCtrl',function($scope){ $scope.$on('to-parent',data) { console.log('BroCtrl to-parent',data); //平级得不到值 }); $scope.$on('to-child',data) { console.log('BroCtrl to-child',data); //平级得不到值 }); }); </script>
Output:
SelfCtrl to-child child
ChildCtrl to-child child
SelfCtrl to-parent parent
ParentCtrl to-parent parent