标签：tle 内容 事件对象 对象 handler 异常 send 地址 htm
在这里写的技术点 一部分参考AngularJs权威教程一部分参考的是其它的博主的知识点
事件 :如同浏览器响应浏览器层的事件，比如鼠标点击、页面滚动那样，Angular应用也可以响应Angular事件.
这使我们在我们应用中嵌套各组件之间进行通信,即使这些组件在创建的时候并未考虑其他组件.我们可以认为事件是在应用中传播的事件信息片段,通常包含应用中发生的事件信息
注意: AnjularJs事件系统并不与浏览器中的事件系统相通,这意问着我们只能在作用域上监听Angular事件而不是在DOM事件
1.$emit事件函数的调用中,事件从子作用域冒泡到父作用域
$emit()函数可以接受两个参数
2.$broadcast事件的函数调用中是向下传递事件 其参数和$emit一样
3.$on事件的监听 on参数
4.事件对象的属性() 这些可以通过函数event对象进行操作
5.核心系统的$emitted事件
6.核心系统的$broadcast事件
关于代码的测试
<!DOCTYPE html>
<!-- 这里是初始化anglularJs 的一个应用程序 -->
<html>
<head>
<meta charset="UTF-8">
<title>http练习</title>
<script type="text/javascript" src="js/angular-1.3.0.js"></script>
<style type="text/css">
div{border:1px solid #ff7300;padding:20px;margin:10px;border-radius:5px}
</style>
</head>
<body ng-app="app">
<!-- 创建一个父级作用域 -->
<div ng-controller="ParentController">
<input type="button" ng-click=‘parentCl()‘ value="点击父亲">
<div ng-controller="OneSelfController">
<input type="button" ng-click="clickeMe()" value="点击自己"/>
<!-- 创建一个子级作用域 -->
<div ng-controller="ChildController">
自己的 子级作用域
</div>
</div>
<div ng-controller="siblingsController">
自己的平级作用域
</div>
</div>
<script type="text/javascript">
var app=angular.module("app",[]);
app.controller(‘OneSelfController‘,function($scope){
$scope.clickeMe=function(){
alert(‘你好‘);
//向子作用域传播数据
$scope.$broadcast(‘sendChild‘,‘给子控制器传递数据‘);
//向父作用域传播数据(冒泡)
$scope.$emit(‘sendParent‘,‘冒泡到父元素‘)
};
});
app.controller(‘ParentController‘,function($scope){
//监听$emit()事件的
$scope.$on(‘sendParent‘,function(event,data){
console.log(‘OneSelfController传递过来的数据‘,data,event.name,event);
});
$scope.parentCl=function(){
//向所有子作用域传递数据
alert(‘你好‘);
$scope.$broadcast(‘sendAllChild‘,‘让siblingsController接收到‘)
};
});
app.controller(‘ChildController‘,function($scope){
//监听
$scope.$on(‘sendChild‘,function(event,data){
console.log(‘ChildCtrl‘,data,event.name,event);
});
})
app.controller(‘siblingsController‘,function($scope){
$scope.$on(‘sendAllChild‘,function(event,data) {
console.log(‘值过来吧‘, data);
});
//传播不会向平级传播的
$scope.$on(‘sendParent‘, function(event,data) {
alert(‘你是谁‘);
console.log(‘平级得不到值‘, data);
});
$scope.$on(‘sendChild‘, function(event,data) {
console.log(‘平级得不到值‘, data);
});
});
</script>
</body>
</html>
angularjs中的事件传播$emit,$broadcast,$on
标签：tle 内容 事件对象 对象 handler 异常 send 地址 htm
原文地址：http://www.cnblogs.com/hu-bo/p/6362687.html
