zoukankan      html  css  js  c++  java
  • angular 控制器间通信

    <div ng-controller="parent">
        <div ng-controller="chilren1">
        </div>
        <div ng-controller="chilren2">
        </div>
    </div>

    以上代码的结构模型如下:

    图1 结构模型

    1.基于作用域链

    angular作用域的关系是一个树状结构,根节点是$rootscope,根节点$rootScope有子节点$scope,子节点$scope又有子节点$scope。此外,子节点$scope也可脱离树状结构,与父$scope隔离。

    控制器产生一个新的子作用域$scope,children1和children2的作用域继承parent作用域。

    (1)子控制器与父控制器通信

        a.基本数据类型

        子控制器创建一个变量,属于自身的属性,与父控制器无关。

        子控器访问的变量如果自身没有,则向父控制器中查找,若在父控制器中找到,则获得父控制器的变量的值。

       子控制器修改一个变量,属于修改本身的属性,与父控制无关。

        b.引用类型

        子控制器创建个对象a,若父控制器有名为a的对象,则子控制器对象a拥有自己对象属性,并把父控制器的对象a覆盖掉。

        子控制器访问对象a,若自身拥有名为a的对象,则访问的是自身的对象。若自身没有a对象,访问父控制器的对象a。

        子控制器修改对象a的属性,若自身拥有a对象,修改的是自身的a对象。若自身没有a对象,修改的是父控制的对象a的属性。

    (2)父控制器与子控制器通信

         基于作用域链,父控制器作用域不能访问修改子控制器的作用域。

    2.基于事件

    (1)向上传播

            父控制器先通过$on注册监听事件,子控制器通过$emit给父控制器传播事件时,则触发父控制器相对应的监听的事件。

    (2)向下广播

       子控制器先通过$on注册监听事件,父控制器通过$broadcast给子控制器广播播事件时,则触发子控制器相对应的监听的事件。

    3.基于服务

      服务是一个单例对象,在应用只被实例化一次,并且存在于应用的整个生命周期中。利用服务的这个特性,可以存储一些数据,控制器都可以操作这个服务,达到控制器间的数据共享。

    图2 服务

         如图2所示,parent、children1、children2都可以操作obj,通过obj这三者共享数据并相互间接通信。

  • 相关阅读:
    nao机器人使用手册
    突然感觉简单的东西是最美的
    window10教育版激活失败
    linux新分区无法新建文件夹
    看看CSDN的吃相
    游戏mod启动器原理
    显示器选购指南
    维修老电视
    快乐小丑
    这猫会关水龙头,所以你只要给猫猫打开就行——华中师范大学的胖猫
  • 原文地址:https://www.cnblogs.com/fe-huahai/p/5613659.html
Copyright © 2011-2022 走看看