zoukankan      html  css  js  c++  java
  • 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);
            });
        }]);
  • 相关阅读:
    一天一个shell实例(1)文本中n个出现频率最高的单词(转)
    JNDI全攻略(一)(转)
    JNDI 学习(转)
    JNDI全攻略(二)(转)
    C#开发系列 文章索引
    AppControls
    JSF系列 文章索引
    [转载]DELPHI组件安装全攻略
    什么是有价值的人生
    [转载]InnoSetup5.2.3啊风增强版 安装代码
  • 原文地址:https://www.cnblogs.com/leijiuling/p/5581661.html
Copyright © 2011-2022 走看看