ng-events類似ionic中Events的angular全局事件
介紹
ng-events 在 Angular 2 以上的版本中使用,類似于 ionic 中的 Events??梢允褂?ng-events 注冊(cè)一個(gè)全局事件,然后在需要的時(shí)候觸發(fā)這個(gè)事件。
快速開(kāi)始
npm install ng-events --save
在 Angular 6 以上的版本中使用,修改 angular.json 文件, 在Angular 6以下版本中使用,修改.angular-cli.json文件
"scripts": [ "node_modules/ng-events/dist/ng-events.js" // ... ]
當(dāng)然也可以直接在index.html中引入,不過(guò)并不推薦這么做。
注冊(cè)事件
•你可以使用 ngEevents.on 注冊(cè)一個(gè)全局事件:
ngEvents.on('eventName', function (item) { console.log(item.name + ' was selected!'); });
第一個(gè)參數(shù)是事件的唯一名稱。 第二個(gè)參數(shù)是在觸發(fā)指定事件時(shí)調(diào)用的回調(diào)函數(shù)。
•您可以使用 ngEvents.off 方法取消注冊(cè)的事件。
觸發(fā)事件
使用 ngEvents.trigger 觸發(fā)一個(gè)全局事件:
ngEvents.trigger('eventName', { id: 42, name: 'Pencil' });
第一個(gè)參數(shù)是事件的唯一名稱. 第二個(gè)是(可選)事件參數(shù)。
你可以添加任意數(shù)量的參數(shù)并在回調(diào)方法中獲取它們。
總結(jié)
以上所述是小編給大家介紹的ng-events類似ionic中Events的angular全局事件,希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
- ionic3+Angular4實(shí)現(xiàn)接口請(qǐng)求及本地json文件讀取示例
- angular+ionic返回上一頁(yè)并刷新頁(yè)面
- 利用Ionic2 + angular4實(shí)現(xiàn)一個(gè)地區(qū)選擇組件
- Ionic + Angular.js實(shí)現(xiàn)圖片輪播的方法示例
- AngularJS之ionic 框架下實(shí)現(xiàn) Localstorage本地存儲(chǔ)
- Ionic+AngularJS實(shí)現(xiàn)登錄和注冊(cè)帶驗(yàn)證功能
- angular+ionic 的app上拉加載更新數(shù)據(jù)實(shí)現(xiàn)方法
相關(guān)文章
深入聊一聊Angular開(kāi)發(fā)的內(nèi)容
使用Angular開(kāi)發(fā)需要非常多的前置知識(shí),比如TypeScript、RxJS等,所以學(xué)習(xí)成本比較高,下面這篇文章主要給大家關(guān)于Angular開(kāi)發(fā)內(nèi)容的相關(guān)資料,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-05-05AngularJs學(xué)習(xí)第五篇從Controller控制器談?wù)?scope作用域
這篇文章主要介紹了AngularJs(五)從Controller控制器談?wù)?scope作用域 的相關(guān)資料,需要的朋友可以參考下2016-06-06使用AngularJS編寫多選按鈕選中時(shí)觸發(fā)指定方法的指令代碼詳解
最近做項(xiàng)目時(shí)遇到了需要用到多選按鈕選中觸發(fā)事件的功能,小編試著手寫一個(gè)指令,具體實(shí)現(xiàn)代碼大家參考下本文吧2017-07-07AngularJS $on、$emit和$broadcast的使用
本文主要介紹AngularJS $on、$emit和$broadcast的使用,這里整理了詳細(xì)的資料及簡(jiǎn)單示例代碼有興趣的小伙伴可以參考下2016-09-09關(guān)于Angularjs中自定義指令一些有價(jià)值的細(xì)節(jié)和技巧小結(jié)
這篇文章主要介紹了關(guān)于Angularjs中自定義指令一些有價(jià)值的細(xì)節(jié)和技巧小結(jié),小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-04-04AngularJs實(shí)現(xiàn)聊天列表實(shí)時(shí)刷新功能
這篇文章主要介紹了AngularJs實(shí)現(xiàn)聊天列表實(shí)時(shí)刷新功能,需要的朋友可以參考下2017-06-06AngularJS實(shí)現(xiàn)表單元素值綁定操作示例
這篇文章主要介紹了AngularJS實(shí)現(xiàn)表單元素值綁定操作,結(jié)合具體實(shí)例形式分析了AngularJS針對(duì)表單元素屬性相關(guān)操作技巧,需要的朋友可以參考下2017-10-10AngularJS學(xué)習(xí)筆記(三)數(shù)據(jù)雙向綁定的簡(jiǎn)單實(shí)例
這篇文章主要介紹了AngularJS學(xué)習(xí)筆記(三)數(shù)據(jù)雙向綁定的簡(jiǎn)單實(shí)例,詳解數(shù)據(jù)雙向綁定實(shí)例的相關(guān)資料,需要的朋友可以參考下。2016-11-11