AngularJs事件

控制器信息传递的三种方式:

利用$rootScope

Angular JS中的作用域有一个非常有层次和嵌套分明的结构.其中她们都有一个主要的$rootScope然后其他所有的作用域部分都是继承自这个$rootScope的,或者说都是嵌套在主作用域下面的。

2.利用service服务

其中一个选择就是在应用程序作用域之中创建一个单例服务,然后通过这个服务处理所有子作用域的通信。

3.利用时间传播

事件传播的基本对象

<div ng-controller="parentController">
            parentController
            <ul>
                <li ng-repeat="i in [1]" ng-controller="currentController">
                    <button ng-click="emitEvent()">
                        事件向上传播 $emit('parentEvent')
                    </button>
                    <button ng-click="broadcastEvent()">
                        事件向下传播 $broadcast('sonEvent')
                    </button>
                    <br>
                    currentController
                    <ul>
                        <li ng-repeat="item in [1, 2]" ng-controller="sonController">
                            sonController
                        </li>
                    </ul>
                </li>
            </ul>
        </div>
 */
function parentController($scope) {
    // 注册事件的第一个参数是事件对象,第二个是事件传递的参数
    $scope.$on('parentEvent', function(event,paramObj) {
        console.log("parentEvent");
        console.dir(paramObj);
    });
}

function currentController($scope) {
    // 注册事件的第一个参数是事件对象,第二个是事件传递的参数
    $scope.$on('currentEvent', function(event,paramObj) {
        console.log("currentEvent");
        console.dir(paramObj);
    });

    // 触发在当前$scope的父亲$scope对象
    $scope.emitEvent = function(){
        var paramObj = {
            name : "wangyuyong",
            age : 22
        };
        $scope.$emit("parentEvent", paramObj);
    };

    // 触发在当前$scope的子$scope对象
    $scope.broadcastEvent = function(){
        var paramObj = {
            name : "liumei",
            age : 23
        };
        $scope.$broadcast("sonEvent", paramObj);
    };

}

function sonController($scope) {
    // 注册事件的第一个参数是事件对象,第二个是事件传递的参数
    $scope.$on('sonEvent', function(event,paramObj) {
        console.log("sonEvent");
        console.dir(paramObj);
    });
}

1、$emit 广播给父controller 

2、$broadcast 是从发送者向他的子scope广播一个事件。

3、$emit 广播给父controller,父controller 是可以收到消息

4、$on 有两个参数function(event,msg)  第一个参数是事件对象,第二个参数是接收到消息信息.

 

猜你喜欢

转载自wangyuying.iteye.com/blog/2379032
今日推荐