angularJS广播

控制器之间共享数据(向父级/子级控制器传递event,data),类似于service在不同的控制器中通信

html:

<div ng-controller="ParentCtrl">
    <div ng-controller="SelfCtrl">
        <a ng-click="click()">click</a>
        <div ng-controller="ChildCtrl"></div>
    </div>
    <div ng-controller="BroCtrl"></div>
</div>

js:

angular.module('myApp', [])
    .controller('SelfCtrl', ['$scope','$rootScope', function($scope, $rootScope){
        var admin1 = {
            'name': 'father',
            'age': 45
        };
        var admin2 = {
            'name': 'Lucy',
            'age': 25
        };
        $scope.click = function() {
            //事件的发送
            //向子级控制器传递数据和事件,只有ChildCtrl能接受到广播,还有自己
            $scope.$broadcast('to-child', admin2);
            //向父级控制器传递数据和事件,只有parentCtrl能接收到广播,还有自己
            $scope.$emit('to-parent', admin1);
            //$rootScope发出的广播所有的作用域都可以接受到,
            $rootScope.$broadcast('to-bro', '平级的数据');
        }
    }]).controller('ParentCtrl', ['$scope', '$rootScope', function($scope, $rootScope){
        //事件的接受
        $scope.$on('to-parent', function(event, data){
            console.log(event);
        });
    }]).controller('ChildCtrl', ['$scope', '$rootScope', function($scope, $rootScope){
        $scope.$on('to-child', function(event, data){
            console.log(data);
        });
    }]).controller('BroCtrl', ['$scope', '$rootScope', function($scope, $rootScope){
        //$scope和$rootScope都可以接受到事件
        $scope.$on('to-bro', function(event, data){
            console.log(data);
        });
        $rootScope.$on('to-bro', function(event, data){
            console.log(data);
        });
    }]);

 

posted on 2016-06-13 18:52  没心.没肺  阅读(2245)  评论(0编辑  收藏  举报

导航