在這里寫的技術點 一部分參考AngularJs權威教程一部分參考的是其它的博主的知識點
事件 :如同瀏覽器響應瀏覽器層的事件，比如鼠標點擊、頁面滾動那樣，Angular應用也可以響應Angular事件.
這使我們在我們應用中嵌套各組件之間進行通信,即使這些組件在創建的時候並未考慮其他組件.我們可以認為事件是在應用中傳播的事件信息片段,通常包含應用中發生的事件信息
注意: AnjularJs事件系統並不與瀏覽器中的事件系統相通,這意問着我們只能在作用域上監聽Angular事件而不是在DOM事件
1.$emit事件函數的調用中,事件從子作用域冒泡到父作用域
$emit()函數可以接受兩個參數
- name(字符串 要發生的事件的名字)
- args(集合 一個參數的集合，作為對象傳遞到事件監聽器中。)
- 從監聽器中發出的切異常都會傳遞到$exceptionHandler服務中
2.$broadcast事件的函數調用中是向下傳遞事件 其參數和$emit一樣
3.$on事件的監聽 on參數
- 進行監聽的事件的名字
- 函數 (event ,data) data 是事件中所傳遞的信息 event 則是事件對象
4.事件對象的屬性() 這些可以通過函數event對象進行操作
- targetScope（作用域對象）這個屬性是發送或者廣播事件的作用域。
- currentScope（作用域對象）這個對象包含了當前處理事件的作用域。
- name（字符串）這個字符串是觸發之后，我們正在處理的事件名稱。
- stopPropagation（函數）stopPropagation()函數取消通過$emit觸發的事件的進一步傳播。
- preventDefault（函數）preventDefault把defaultPrevented標志設置為true。盡管不能停止事件的傳播，我們可以告訴子作用域無需處理這個事件（也就是說，可以安全地忽略它們）。
- defaultPrevented（布爾值） 調用preventDefault()會把defaultPrevented設置為true。
5.核心系統的$emitted事件
- $includeContentLoaded $includeContentLoaded事件當ngInclude的內容重新加載時，從ngInclude指令上觸發。
- $includeContentRequested $includeContentRequested事件從調用ngInclude的作用域上發送。每次ngInclude的內容 被請求時，它都會被發送。
- $viewContentLoaded $viewContentLoaded事件每當ngView內容被重新加載時，從當前ngView作用域上發送。
6.核心系統的$broadcast事件
- $locationChangeStart 當Angular從$location服務（通過$location.path()、$location.search()等）對瀏覽器 的地址作更新時，會觸發$locationChangeStart事件。
- $locationChangeSuccess 當且僅當瀏覽器的地址成功變更，又沒有阻止$locationChangeStart事件的情況下，$locationChangeSuccess事件會從$rootScope上廣播出來。
- $routeChangeStart 在路由變更發生之前，$routeChangeStart事件從$rootScope發送出來。也就是在路由服務開始解析路由變更所需的所有依賴項時。
- $routeChangeSuccess 在所有路由依賴項跟着$routeChangeStart 被解析之后， $routeChangeSuccess 被從$rootScope上廣播出來。ngView指令使 用$routeChangeSuccess事件來獲悉何時實例化控制器並渲染視圖。
- $routeChangeError 如果路由對象上任意的resolve屬性被拒絕了，$routeChangeError就會被觸發（比如它們失 敗了）。這個事件是從$rootScope上廣播出來的。
- $routeUpdate 如果$routeProvider上的reloadOnSearch屬性被設置成false，並且使用了控制器的同一個實例，$routeUpdate事件會被從$rootScope上廣播。
- $destroy 在作用域被銷毀之前，$destroy事件會在作用域上廣播。這個順序給子作用域一個機會，在父作用域被真正移除之前清理自身。
關於代碼的測試
<!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>