angular view之间的数据传递

  之前写过一篇backbone view之间的传递,由于现在在用angular搞开发,现在也来总结一下。在angular 传递数据通俗的讲叫做 广播 ,在一些文章中,也叫做事件的发布与订阅,在angular中通过 发布与订阅制定了数据的传递,使用时,在出发点广播事件,这个事件后面的参数是传递的数据,在适当的位置去进行接收,具体到开发中,对应着$scope和$rootScope的$emit$broadcast$on方法。首先了解一下概念:

  1.$scope与$scope之间的关系,$scope与$rootScope之间的关系

  $rootScope是最顶部的大哥,是所有$scope的老大,而$scope与$scope之间,就比较多了,有可能是父子关系,也有可能是兄弟关系,angular为每一个controller分配一个独立的$scope,$scope之间的关系也就是由controller之间的关系来决定的。

<div ng-controller="ParentCtrl as parent">
    {{ parent.data }}
    <div ng-controller="SiblingOneCtrl as sib1">
        {{ sib1.data }}
    </div>
    <div ng-controller="SiblingTwoCtrl as sib2">
        {{ sib2.data }}
    </div>
</div>

  2.广播,接收与销毁

  $broadcast$emit用于广播事件,他们将事件名称和事件内容发布出去,就像是高考榜单一样,事件名称相当于考生的名字,而事件内容相当于考生的成绩等信息,而$broadcast$emit的不同之处在于$broadcast是自上而下的广播,所有能听到的都可以对其进行反应。而$emit是自下而上的射箭,只有在箭矢的轨迹上才能对其做出反应。

$scope.$broadcast(‘EVENT_NAME‘, ‘Data to send‘);
$scope.$emit(‘EVENT_NAME‘, ‘Data to send‘);

  $on用于接受事件,事件名称是订阅的唯一标识,每个考生看榜单时都要寻找自己的名字,然后根据自己的成绩等信息决定下一步应该报考什么学校:

$scope.$on(‘EVENT_NAME‘, function(event, args) {
    // balabala
});

  angular的销毁是在$on中,使用$on接收事件时会返回一个函数,而此函数就是用来退订事件的方法,就像是考生看到了自己的成绩后禀告父母大人,“商量着”选取学校填报志愿,而此志愿单就是结束整个高考榜单的结束:

// 接收事件返回用于销毁事件的函数
var deregister = $scope.$on(‘EVENT_NAME‘, function(event, args) {
    // balabala
});

// 销毁事件
deregister();

  ok  这就类似于backbone中的事件注册机,相比之下 trigger on 要更简单暴力一些,至于angular为什么要这么设计,我还只是一个初学者 不能理解。

时间: 2024-10-29 19:11:18

angular view之间的数据传递的相关文章

ASP.NET MVC3中Controller与View之间的数据传递总结

</pre>在ASP.NET MVC<span style="font-family:宋体">中,经常会在</span>Controller<span style="font-family:宋体">与</span>View<span style="font-family:宋体">之间传递数据,因此,熟练.灵活的掌握这两层之间的数据传递方法就非常重要.本文从两个方面进行探讨:&

ASP.NET MVC中Controller与View之间的数据传递总结

在ASP.NET MVC中,经常会在Controller与View之间传递数据,因此,熟练.灵活的掌握这两层之间的数据传递方法就非常重要.本文从两个方面进行探讨: Ø Controller向View传递数据 Ø View向Controller传递数据 一.Controller向View传递数据 1.       使用ViewData传递数据 我们在Controller中定义如下: ViewData[“Message”] = “Hello word!”; 然后在View中读取Controller中

ASP.NET MVC3中Controller与View之间的数据传递

在ASP.NET MVC中,经常会在Controller与View之间传递数据,因此,熟练.灵活的掌握这两层之间的数据传递方法就非常重要.本文从两个方面进行探讨: 一.  Controller向View传递数据 1.       使用ViewData传递数据 我们在Controller中定义如下: [csharp] view plain copy print? ViewData["Message_ViewData"] = " Hello ViewData!"; Vi

Asp.net MVC中 Controller 与 View之间的数据传递

在ASP.NET MVC中,经常会在Controller与View之间传递数据 1.Controller向View中传递数据 (1)使用ViewData["user"] (2)使用ViewBag.user (3)使用TempData["user"] (4)使用Model(强类型) 区别: (1)ViewData与TempData方式是弱类型的方式传递数据,而使用Model传递数据是强类型的方式. (2)ViewData与TempData是完全不同的数据类型,View

ASP.NET MVC中Controller与View之间的数据传递

一.Controller向View传递数据 Controller向View传递数据有3种形式: 1.通过ViewData传递 在Controller里面定义ViewData,并且赋值,比如 ViewData["contact"] = contact; 然后在View里面读取Controller中定义的ViewData数据 比如联系人: <input type="text" value='<%=ViewData["contact"] %

Controller与View之间的数据传递

1)Controller向View传递数据ViewData["message"] = "Hello";//使用ViewData传递数据ViewBag.Time = DateTime.Now;//ViewBag传递数据TempData["mes"] = "text";//使用TempData传递数据//使用静态字段定义变量public static string str;//全局的str = "123";//

(Android review)Activity之间的数据传递

一.基本知识点 1.Activity之间传递数据1)传递基本类型或String intent.putExtra("username", username);  getIntent(); intent.getStringExtra("username"); 2)以bundle的形式传 Bundle bundle = new Bundle();    bundle.putString("username", username);    bundle.

Backbone中父子view之间的值传递

backbone中,使用最多的莫过于在view中进行操作,如模板的渲染以及事件函数的定义.为了提高代码的可维护性,一般地我们会写多个视图即view,将界面按照功能的不同进行模块化划分,模块与view一一对应. 首先,我们会定义一个父view,在view中控制不同子view的渲染,子view之间尽量不产生联系.这样,代码之间的耦合度会降低很多,模块的功能明确化,同时降低了开发的难度.笔者最近在项目中遇到父子view传值问题,学习到了一个知识点,比较简单易懂.主要想分享两个内容:1.父子view是如

Activity之间的数据传递

最常用的Activity之间的数据传递. 1 btnStartAty1.setOnClickListener(new View.OnClickListener() { 2 @Override 3 public void onClick(View v) { 4 Intent i=new Intent(MainActivity.this, Activity1.class); 5 //Activity之间的数据传递 6 //i.putExtra("txt", "这是第一种Activ