理解angularjs中的$emit,$broadcast和$on

在angularjs中提供了emit,broadcast和$on服务用于控制器之间基础事件的传递交流。 
1、$emit 
该服务贯穿作用域发出一个向上的事件,并通知哪些注册在rootScope.Scopeemit被启动的地方,事件一直朝着根作用域传递,传递期间并通知哪些注册在作用域上的监听器,如果这期间一个监听器接受到了这个事件,会注销这个事件,那么事件将会停止向上继续传播。 

这里写图片描述




Broadcasting


Parent Controller

Emit Message :


Child Controller


运行结果如下:

这里写图片描述

2、$broadcast 
该服务发布一个向下的事件给作用域中的所有子节点以及以下的节点,并通知注册在 

rootScope.Scopebroadcast被启动开始。下面的所有作用域都会接收到通知。之后,事件向下传播,在这期间,作用域中的监听器接收到通知,获取事件,但是不会注销事件,事件继续往下传播。



Broadcasting


Parent Controller


Child Controller

Broadcast Message :

运行结果如下:

这里写图片描述 

3、$on 
该服务监听指定类型的事件,获取从 emitbroadcast发布的事件。 


1、如果在作用域中没有父子关系存在,可以在控制器中注入$rootScope、使用$broadcast服务向下传播事件,但是不能通过$emit向上传播事件。

2、在作用域中存在父子关系时,可以也仅可以由子控制器使用$emit服务向上传播事件,同时父作用域中的控制监听器可以注销事件。


4、提示

1、如果在作用域中没有父子关系存在,可以在控制器中注入$rootScope、使用$broadcast服务向下传播事件,但是不能通过$emit向上传播事件。
2、在作用域中存在父子关系时,可以也仅可以由子控制器使用$emit服务向上传播事件,同时父作用域中的控制监听器可以注销事件。


[原文地址 Understanding emit,broadcast and $on in AngularJS] 

(http://www.dotnet-tricks.com/Tutorial/angularjs/HM0L291214-Understanding-emit,broadcast-and-$on-in-AngularJS.html)


本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!

相关文章

立即
投稿

微信公众账号

微信扫一扫加关注

返回
顶部