angularjs的事件 $broadcast and $emit and $on
angularjs的事件 $broadcast and $emit and $on
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body ng-app="search">
<div ng-controller="ParentCtrl">
<div ng-controller="SelfCtrl">
<a class="btn" ng-click="click()">click me</a>
<div ng-controller="ChildCtrl"></div>
</div>
<div ng-controller="BroCtrl"></div>
</div>
<script src="angular.min.js"></script>
<script>
var search = angular.module('search', [])
.controller('ParentCtrl', function($scope) {
$scope.$on('to-child', function(e, d) {
console.log('关我毛事')
})
$scope.$on('to-parent', function(e, d) {
console.log('we are the parent, I got it', d)
})
})
.controller('SelfCtrl', function($scope) {
$scope.click = function () {
$scope.$broadcast('to-child', 'haha') // 向子
$scope.$emit('to-parent', 'hehe') // 向父
}
})
.controller('ChildCtrl', function($scope){
$scope.$on('to-child', function(e, d) {
console.log('I\' the child, I got it', d)
})
$scope.$on('to-parent', function(e, d) {
console.log('关我毛事')
})
})
.controller('BroCtrl', function($scope){
$scope.$on('to-child', function(e, d) {
console.log('关我毛事')
})
$scope.$on('to-parent', function(e, d) {
console.log('关我毛事')
})
})
</script>
</body>
</html>
angularjs的事件 $broadcast and $emit and $on的更多相关文章
- angularjs事件通信$on，$emit，$broadcast详解
公司项目开发用的是angularjs,关于事件通讯一直用的是EventBus,直到上周写一个小组件懒得引用EventBus时,想到用angularjs自带的事件通信时,结果很尴尬的忘记原生方法单词怎么 ...
- angularJS控制器之间的相互通信方式、$broadcast、$emit、$on
在项目中,我们可能会很经常性的利用到控制器之间的相互通信,在angular中的控制器之间的相互通信有以下几种方式: 1)通过本地数据的存储localstorage,sessionstorage, 2) ...
- angularjs事件传递$on、$emit和$broadcast
如何在作用域之间通信呢? 1.创建一个单例服务,然后通过这个服务处理所有子作用域的通信. 2.通过作用域中的事件处理通信.但是这种方法有一些限制:例如,你并不能广泛的将事件传播到所有监控的作用域中.你 ...
- 通过$broadcast或$emit在子级和父级controller之间进行值传递
通过$broadcast或$emit在controller之间进行值传递,不过这些controller必须是子级或者父级关系, $emit只能向父级parent controller传递事件event ...
- angular之$broadcast、$emit、$on传值
文件层级 index.html <!DOCTYPE html> <html ng-app="nickApp"> <head> <meta ...
- Angular中$broadcast和$emit的使用方法
要在控制器之间传递变量变化需要使用angular中的$broadcast和$emit方法来传递,同时使用$on来接收事件并作出响应. broadcast译为广播,即上级传递下级. 示例代码: < ...
- AngularJS的学习--$on、$emit和$broadcast的使用
AngularJS中的作用域有一个非常有层次和嵌套分明的结构.其中它们都有一个主要的$rootScope(也就说对应的Angular应用或者ng-app),然后其他所有的作用域部分都是继承自这个$ro ...
- AngularJS 事件广播与接收 $emit $broadcast $on
AngularJS中的作用域scope有一个非常有层次和嵌套分明的结构. 其中它们都有一个主要的$rootScope(也就说对应的Angular应用或者ng-app),然后其他所有的作用域部分都是继承 ...
- angularJS 系列（六）---$emit(), $on(), $broadcast()的使用
下面以一个例子来讲述 angular 中的event system,有$emit(), $on(), $broadcast().效果图如下 下面的代码中,用到了 controller AS 的语法,具 ...
随机推荐
- PySide 简易教程<一>-------Hello PySide
PySide 是一个python绑定的跨平台GUI Qt库.目前,支持Python的Qt库有两个PyQt和PySide.PySide是一个免费的软件,与PyQt不同之处在于使用了LGPL,允许PySi ...
- what is the virtual machine, when and why we need use it ?
虚拟机(Virtual Machine)指通过软件模拟的具有完整硬件系统功能的.运行在一个完全隔离环境中的完整计算机系统. 通过虚拟机软件,你可以在一台物理计算机上模拟出二台或多台虚拟的计算机,这些虚 ...
- lazy instructor
Description A math instructor is too lazy to grade a question in the exam papers in which students a ...
- ubuntu安装oracle java
通常UBUNTU源中带有openjava,但在使用eclipse与android studio时经常会有莫名奇妙的问题,所以个人觉得还是用oracle java,省点心. 安装步骤如下: sudo a ...
- C# - dynamic 类型
C#4引入dynamic关键字,定义变量时,可以不初始化它的值. dynamic类型仅在编译期间存在,在运行期间会被System.Object类型替代. dynamic myDynamicVar; m ...
- 理解UIEdgeInsets
供参考 iOS 的控件,只看到 UIButton 可以设置 Padding/Insets,即按钮上文字或图片与按钮边界的间隙. CSS 上叫做 Padding,在 iOS 中叫做 Insets,UIB ...
- [cc150] check palindrome of a singly linked list
Problem: Implement a function to check if a singly linked list is a palindrome. 思路: 最简单的方法是 Reverse ...
- ural 1066 uva 1555
好吧 竟然因为编译器的问题不过 到底有什么区别 ???? 可以推出公式Hi = (i-1)H2 +(i-1)(i-2)-(i-2)*H1 因为所有的Hi都要大于零 Hn要最小 即存在Hi=0 ...
- c++ ANSI、UNICODE、UTF8互转
static std::wstring MBytesToWString(const char* lpcszString); static std::string WStringToMBy ...
- php采集远程文章简单类
<?php /** * 采集类 * @author Milkcy * @copyright (C) 2012-2015 TCCMS.COM * @lastmodify 2012-07-10 14 ...