Angularjs Controller 间通信机制
在Angularjs开发一些经验总结随笔中提到我们需要按照业务却分angular controller,避免过大无所不能的上帝controller,我们把controller分离开了,但是有时候我们需要在controller中通信,一般为比较简单的通信机制,告诉同伴controller我的某个你所关心的东西改变了,怎么办?如果你是一个javascript程序员你会很自然的想到异步回调响应式通信—事件机制(或消息机制)。对,这就是angularjs解决controller之间通信的机制,所推荐的唯一方式,简而言之这就是angular way。
Angularjs为在scope中为我们提供了冒泡和隧道机制,$broadcast会把事件广播给所有子controller,而$emit则会将事件冒泡传递给父controller,$on则是angularjs的事件注册函数,有了这一些我们就能很快的以angularjs的方式去解决angularjs controller之间的通信,代码如下:
View:
- <div ng-app="app" ng-controller="parentCtr">
- <div ng-controller="childCtr1">name :
- <input ng-model="name" type="text" ng-change="change(name);" />
- </div>
- <div ng-controller="childCtr2">Ctr1 name:
- <input ng-model="ctr1Name" />
- </div>
- </div>
Controller:
- angular.module("app", []).controller("parentCtr",
- function ($scope) {
- $scope.$on("Ctr1NameChange",
- function (event, msg) {
- console.log("parent", msg);
- $scope.$broadcast("Ctr1NameChangeFromParrent", msg);
- });
- }).controller("childCtr1", function ($scope) {
- $scope.change = function (name) {
- console.log("childCtr1", name);
- $scope.$emit("Ctr1NameChange", name);
- };
- }).controller("childCtr2", function ($scope) {
- $scope.$on("Ctr1NameChangeFromParrent",
- function (event, msg) {
- console.log("childCtr2", msg);
- $scope.ctr1Name = msg;
- });
- });
这里childCtr1的name改变会以冒泡传递给父controller,而父controller会对事件包装在广播给所有子controller,而childCtr2则注册了change事件,并改变自己。注意父controller在广播时候一定要改变事件name。
jsfiddle链接:http://jsfiddle.net/whitewolf/5JBA7/15/
Angularjs Controller 间通信机制相关推荐
- 最高效的进(线)程间通信机制--eventfd
我们常用的进程(线程)间通信机制有管道,信号,消息队列,信号量,共享内存,socket等等,其中主要作为进程(线程)间通知/等待的有管道pipe和socketpair.线程还有特别的condition ...
- 【SemiDrive源码分析】【X9芯片启动流程】21 - MailBox 核间通信机制介绍(代码分析篇)之 Mailbox for Linux 篇
[SemiDrive源码分析][X9芯片启动流程]21 - MailBox 核间通信机制介绍(代码分析篇)之 Mailbox for Linux 篇 一.Mailbox for Linux 驱动框架分 ...
- 【SemiDrive源码分析】【X9芯片启动流程】20 - MailBox 核间通信机制介绍(代码分析篇)之 MailBox for RTOS 篇
[SemiDrive源码分析][X9芯片启动流程]20 - MailBox 核间通信机制介绍(代码分析篇)之 MailBox for RTOS 篇 一.Mailbox for RTOS 源码分析 1. ...
- 【SemiDrive源码分析】【X9芯片启动流程】19 - MailBox 核间通信机制介绍(理论篇)
[SemiDrive源码分析][X9芯片启动流程]19 - MailBox 核间通信机制介绍(理论篇) 一.核间通信 二.核间通信软件架构 三.Mailbox 设备驱动 3.1 Mailbox for ...
- android线程间通信的几种方法_Android线程间通信机制
讲解Handler机制的博文很多,我也看了很多,但说实话,在我对Handler几乎不怎么了解的情况下,每一篇文章我都没太看懂,看完之后脑子里还是充满了疑问.究其原因,是因为几乎每一篇文章一上来就开始深 ...
- 【SemiDrive源码分析】【X9芯片启动流程】23 - MailBox 核间通信机制介绍(代码分析篇)之 RPMSG-IPCC Kernel 篇
[SemiDrive源码分析][X9芯片启动流程]23 - MailBox 核间通信机制介绍(代码分析篇)之 RPMSG-IPCC Kernel 篇 一.RPMSG 接口 1.1 Linux Kern ...
- 【SemiDrive源码分析】【X9芯片启动流程】25 - MailBox 核间通信机制介绍(代码分析篇)之 RPMSG-IPCC RTOS QNX篇
[SemiDrive源码分析][X9芯片启动流程]25 - MailBox 核间通信机制介绍(代码分析篇)之 RPMSG-IPCC RTOS & QNX篇 一.RPMSG 接口 1.1 Lin ...
- Android线程间通信机制
Android线程间通信机制 当android应用程序运行时,一个主线程被创建(也称作UI线程),此线程主要负责处理UI相关的事件,由于Android采用UI单线程模型,所以只能在主线程中对UI元素进 ...
- Linux C编程--进程间通信(IPC)1--进程间通信机制概述
linux下进程间通信的几种主要手段简介: 管道(Pipe)及有名管道(named pipe):管道可用于具有亲缘关系进程间的通信,有名管道克服了管道没有名字的限制,因此,除具有管道所具有的功能外,它 ...
最新文章
- 在ASP.NET中如何用C#.NET实现基于表单的验证
- 单链表-逆置单链表(头插法且双指针)
- 前后端API交互如何保证数据安全性?
- 后台开发经典书籍--Zookeeper分布式过程
- mysql单单写join_MySQL系列之Join大法
- websocket 带头部信息请求 header_关于websocket跨域的一个奇怪问题
- 八、栈的操作、栈空间
- 20180804的Test
- [HDFS Manual] CH4 HDFS High Availability Using the Quorum Journal Manager
- 「PPT模板」 商务UI风格
- spring boot controller 初始化_使用 Spring 快速创建 web 应用的两种方式
- mysql salve从库设置read only 属性
- 计算机大赛搞笑队名,电子设计大赛队名
- 中国虚拟人哪家强?沙利文、IDC:小冰百度商汤位列第一梯队
- 亚马逊aws 服务器删除_亚马逊aws服务器免费套餐及被扣款怎么办
- 饥荒食物 + 物品全制造代码
- Android Studio 使用友盟进行多渠道打包
- 一个关于xgen开发导入的问题,但其实我觉得更重要的是过程中发生的事情。
- iphone 热点 android,苹果的个人热点功能android手机能用吗
- 【远程文件浏览器】Unity+Lua开发调试利器
热门文章
- java加载一个来自项目之外的java文件,执行其main方法的一种实现方式
- Flutter Raw Image Provider
- oracle基本的查询语句,oracle 基本查询语句及实例
- 3说明书_电子产品说明书应该怎么翻译?知行君认为需要注意这3点
- 揭秘:神策数据产品矩阵,全方位筑就你的数据驱动闭环
- 数据分析师可不是啥好工作
- Ajax(form表单文件上传、请求头之contentType、Ajax传递json数据、Ajax文件上传)
- Django开发—如何重置migration
- WCF分布式开发必备知识(2):.Net Remoting
- Java异常与运行时异常,以及与线程的关系