angular事件

http://www.cooklife.cn/detail/54c8f838ed5b52846b6bca41#View


對於一款前端框架,提起事件,很容易讓人聯想到DOM事件,比如說鼠標點擊以及頁面滾動等。但是我們這裏說的angular中的事件和DOM事件並不是一個東西。

事件的發佈

我們可以通過$emit()以及$broadcast()來發布事件

$emit(name, args)

name發佈的事件名稱

args會作爲對象傳遞到事件的監聽器中

$emit()發佈的事件,會從子作用域冒泡到父作用域,產生事件的作用域之上的所有作用域都會收到這個事件的通知。


$broadcast(name, args)

同$emit的參數一直,name作爲事件的名字,args作爲監聽器接受 的參數。使用該方法事件的傳播方向是從上至下,即從父作用域到子作用域。

事件的監聽

事件發佈了,我們要註冊監聽事件的服務,纔會對事件進行響應

可以通過$on()方法來註冊事件監聽事件。

$scope.$on(name, listenerFn)

當以name爲事件名的事件被促發之後,listenerFn事件就會被執行。

$on()返回一個反註冊函數,可以用其來取消監聽器。

事件對象

所有的事件監聽器第一個參數都代表了事件對象,該對象有以下屬性:

targetScope作用域對象,發送事件的作用域

currentScope:當前處理事件的作用域

name:當前事件的事件的名稱

stopPropagation:取消$emit觸發的事件進一步的傳播

preventDefaul:把defaultPreevented標誌設置爲true,告訴子作用域可以無需處理該事件。

defaultPreevented:布爾值

angular內置事件

$includeContentLoaded($emit事件)

ngInclude內容重新加載的時候,從ngInclude指令觸發


$includeContentRequested($emit事件)

從調用ngInclude的作用域上發送,每次ngInclude的內容被請求的時候,都會發布該事件


$viewContentLoaded($emit事件)

當ngView內容被重新加載時,從ngView作用域上發佈


$locationChangeStart($broadcast事件)

通過$location服務對瀏覽器的地址更新時會觸發$locationChangeStart事件


$locationChangeSuccess($broadcast事件)

當瀏覽器的地址成功變更時觸發


$routeChangeStart($broadcast事件)

在路由變更發生之前,該事件從$rootScope發佈


發佈了81 篇原創文章 · 獲贊 12 · 訪問量 53萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章