angularJS 事件广播与接收
发送消息: $scope.$emit(name, data) 或者 $scope.$broadcast(name, data);
接收消息: $scope.on(name,function(event,data){ });
区别: $emit 广播给父controller $broadcast 广播给子controller
broadcast 是从发送者向他的子scope广播一个事件。
这里就是ParentController发送, ParentController 和 ChildController 会接受到, 而MainController是不会收到的
$emit 广播给父controller,父controller 是可以收到消息
$on 有两个参数function(event,msg) 第一个参数是事件对象,第二个参数是接收到消息信息
var app = angular.module('onBroadcastEvent', ['ng']); app.controller('MainController', function($scope) {
$scope.$on('To-MainController', function(event,msg) {
console.log('MainController received:' + msg);
});
}); app.controller('ParentController', function($scope) {
$scope.click = function (msg) {
$scope.$emit('To-MainController',msg + ',from ParentController to MainController');
$scope.$broadcast('To-ChildController', msg + ',from ParentController to ChildController');
$scope.$broadcast('To-BrotherController', msg + ',from ParentController to BrotherController');
}
}); app.controller('ChildController', function($scope){
$scope.$on('To-ChildController', function(event,msg) {
console.log('ChildController received:' + msg);
});
}); app.controller('BrotherController', function($scope){
$scope.$on('To-BrotherController', function(event, msg) {
console.log('BrotherController received:' + msg);
});
});
angularJS 事件广播与接收的更多相关文章
- angularJS 事件广播与接收[转]
路由的事件 事件这个词在前端出现的频率真是高,根本拦不住,哪都是.$route服务在路由过程中的每个阶段都会触发不同的事件,可以为这些不同的路由事件设置监听器并做出响应. 一共有4个事件用来监听路由的 ...
- AngularJS 事件广播与接收 $broadcast,$emit,$on 作用域间通信 封装factory服务 发布订阅
不同作用域之间通过组合使用$broadcast,$emit,$on的事件广播机制来进行通信. 一.说明 1.广播 $broadcast 说明:将事件从父级作用域传播至本作用域及子级作用域. 格式:$b ...
- AngularJS 事件广播与接收 $emit $broadcast $on
AngularJS中的作用域scope有一个非常有层次和嵌套分明的结构. 其中它们都有一个主要的$rootScope(也就说对应的Angular应用或者ng-app),然后其他所有的作用域部分都是继承 ...
- Angularjs中的事件广播 —全面解析$broadcast,$emit,$on
Angularjs中不同作用域之间可以通过组合使用$broadcast,$emit,$on的事件广播机制来进行通信 介绍: $broadcast的作用是将事件从父级作用域传播至子级作用域,包括自己.格 ...
- node.js接收异步任务结果的两种方法----callback和事件广播
事件广播 发送方调用emit方法,接收方调用on方法,无论发送方或是接收方,都会工作在一个频道 声明了一个模块,用于读取mime.json中的记录 var fs = require('fs'); va ...
- [spring源码学习]九、IOC源码-applicationEventMulticaster事件广播
一.代码实例 回到第IOC的第七章context部分,我们看源码分析部分,可以看到在spring的bean加载之后的第二个重要的bean为applicationEventMulticaster,从字面 ...
- laravel 事件广播
Laravel 5.1 之中新加入了事件广播的功能,作用是把服务器中触发的事件通过websocket服务通知客户端,也就是浏览器,客户端js根据接受到的事件,做出相应动作.本文会用简单的代码展示一个事 ...
- JS里关于事件的常被考察的知识点:事件流、事件广播、原生JS实现事件代理
1.JS里面的事件流 DOM2级事件模型中规定了事件流的三个阶段:捕获阶段.目标阶段.冒泡阶段,低版本IE(IE8及以下版本)不支持捕获阶段 捕获事件流:Netscape提出的事件流,即事件由页面元素 ...
- Android的有序广播和无序广播(解决安卓8.0版本之后有序广播的接收问题)
前言 Google从Android8.0版本开始,对在清单文件中静态注册广播做了限制. *** 特殊广播(动态注册广播接收者) 说:有序广播和无序广播之前,咱们先来说下Android中一些特殊的广播如 ...
随机推荐
- angularJS1笔记-(17)-ng-bind-html指令
angular不推荐大家在绑定数据的时候绑定html,但是如果你非要这么干也并不是不可以的.举个例子: <!DOCTYPE html> <html lang="en&quo ...
- ubuntu中启动VIM,以及学习VIM
启动VIM:首先打开终端,然后输入vi回车,然后输入i或者a,进入. 学习VIM:首先打开终端,然后输入vimtutor回车,然后进入教程学习.
- 网页访问过程(基于CDN)
1. 全局负载均衡(基于DNS) 如果有多台 WEB 服务器同时为一个域名提供服务时,即一条 URL 对应多个 IP 地址,那么该 URL 的权威域名服务器可能会根据该 URL 解析出多个 IP 地址 ...
- PAT 1072 开学寄语
https://pintia.cn/problem-sets/994805260223102976/problems/994805263964422144 1072 开学寄语(20 分)提问 下图是上 ...
- chrome浏览器下的xdebug helper使用方法
chrome浏览器下的xdebug helper使用方法 自从安装了xdebug后,发现每次调试都需要从eclipse中先从头启动,然后一步步走到你要调试的页面,而不是说想什么时候调试就什么时 ...
- Windows 常见错误总结
本篇主要记录Windows 系统使用中存在的问题和解决方案,会保持持续更新...(若你们遇到的问题或有更好的解决方法,还望在评论区留言,谢谢) 1.win10 unable to save C:\wi ...
- PHP时间格式化参数表笔记
date_create_from_format() 函数返回一个根据指定格式进行格式化的新的 DateTime 对象.通常需要配合date_format()函数使用 语法: date_create_f ...
- Linux下CPU信息的查看
逻辑CPU个数: cat /proc/cpuinfo | grep "processor" | wc -l //32 物理CPU个数: cat /proc/cpuinfo ...
- 【百度】大型网站的HTTPS实践(一)——HTTPS协议和原理
大型网站的HTTPS实践(一)——HTTPS协议和原理 原创 网络通信/物联网 作者:AIOps智能运维 时间:2018-11-09 15:07:39 349 0 前言 百度于2015年上线了全站 ...
- 微信小程序组件 下拉刷新
<!-- &&底部加载 --> <view class='page-add-data flexca'> <text>{{pageTottomText ...