ng-events类似ionic中Events的angular全局事件


Posted in Javascript onSeptember 05, 2018

介绍

ng-events 在 Angular 2 以上的版本中使用,类似于 ionic 中的 Events。可以使用 ng-events 注册一个全局事件,然后在需要的时候触发这个事件。

GitHub地址

快速开始

npm install ng-events --save

在 Angular 6 以上的版本中使用,修改 angular.json 文件, 在Angular 6以下版本中使用,修改.angular-cli.json文件

"scripts": [
       "node_modules/ng-events/dist/ng-events.js"
       // ...
      ]

当然也可以直接在index.html中引入,不过并不推荐这么做。

注册事件

•你可以使用 ngEevents.on 注册一个全局事件:

ngEvents.on('eventName', function (item) {
  console.log(item.name + ' was selected!');
});

第一个参数是事件的唯一名称。 第二个参数是在触发指定事件时调用的回调函数。

•您可以使用 ngEvents.off 方法取消注册的事件。

触发事件

使用 ngEvents.trigger 触发一个全局事件:

ngEvents.trigger('eventName', {
  id: 42,
  name: 'Pencil'
});

第一个参数是事件的唯一名称. 第二个是(可选)事件参数。

 你可以添加任意数量的参数并在回调方法中获取它们。

总结

以上所述是小编给大家介绍的ng-events类似ionic中Events的angular全局事件,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
jquery增加时编辑jqGrid(实例代码)
Nov 08 Javascript
Javascript变量作用域详解
Dec 06 Javascript
Jquery操作radio的简单实例
Jan 06 Javascript
js弹出div并显示遮罩层
Feb 12 Javascript
JavaScript使用addEventListener添加事件监听用法实例
Jun 01 Javascript
JavaScript简单判断复选框是否选中及取出值的方法
Aug 13 Javascript
jquery中实现时间戳与日期相互转换
Apr 12 Javascript
AngularJS入门教程之ng-checked 指令详解
Aug 01 Javascript
jQuery实现的小图列表,大图展示效果幻灯片示例
Oct 25 Javascript
JavaScript函数表达式详解及实例
May 05 Javascript
Vue2.0中集成UEditor富文本编辑器的方法
Mar 03 Javascript
webpack 处理CSS资源的实现
Sep 27 Javascript
vue获取元素宽、高、距离左边距离,右,上距离等还有XY坐标轴的方法
Sep 05 #Javascript
vue 监听屏幕高度的实例
Sep 05 #Javascript
Vue-Router的使用方法
Sep 05 #Javascript
解决vue 绑定对象内点击事件失效问题
Sep 05 #Javascript
Vue作用域插槽slot-scope实例代码
Sep 05 #Javascript
element ui 表格动态列显示空白bug 修复方法
Sep 04 #Javascript
利用chrome浏览器进行js调试并找出元素绑定的点击事件详解
Jan 30 #Javascript
You might like
德生H-501的评价与改造
2021/03/02 无线电
php中$this->含义分析
2009/11/29 PHP
PHP json_decode函数详细解析
2014/02/17 PHP
PHP之将POST数据转化为字符串的实现代码
2016/11/03 PHP
thinkphp ajaxfileupload实现异步上传图片的示例
2017/08/28 PHP
PHP单元测试框架PHPUnit用法详解
2019/01/23 PHP
php redis setnx分布式锁简单原理解析
2020/10/23 PHP
静态页面的值传递(三部曲)
2006/09/25 Javascript
JS中不为人知的五种声明Number的方式简要概述
2013/02/22 Javascript
getJSON调用后台json数据时函数被调用两次的原因猜想
2013/09/29 Javascript
jQuery简单实现仿京东商城的左侧菜单效果代码
2015/09/09 Javascript
vue.js给动态绑定的radio列表做批量编辑的方法
2018/02/28 Javascript
基于vue2.0动态组件及render详解
2018/03/17 Javascript
微信小程序自定义多选事件的实现代码
2018/05/17 Javascript
浅析Proxy可以优化vue的数据监听机制问题及实现思路
2018/11/29 Javascript
在Koa.js中实现文件上传的接口功能
2019/10/08 Javascript
Python多进程同步简单实现代码
2016/04/27 Python
一步步教你用Python实现2048小游戏
2017/01/19 Python
Python内置函数—vars的具体使用方法
2017/12/04 Python
Python 炫技操作之合并字典的七种方法
2020/04/10 Python
python求numpy中array按列非零元素的平均值案例
2020/06/08 Python
BeautifulSoup中find和find_all的使用详解
2020/12/07 Python
python 基于opencv 实现一个鼠标绘图小程序
2020/12/11 Python
Foot Locker意大利官网:全球领先的运动鞋和服装零售商
2017/05/30 全球购物
优质美利奴羊毛袜,不只是徒步旅行:Darn Tough Vermont
2018/11/05 全球购物
优秀学生干部推荐材料
2014/02/03 职场文书
《自然之道》教学反思
2014/02/11 职场文书
法律进机关实施方案
2014/03/12 职场文书
国旗下演讲稿
2014/05/08 职场文书
入职担保书范文
2014/05/21 职场文书
预备党员2014年第四季度思想汇报范文
2014/10/25 职场文书
2015年度学校应急管理工作总结
2015/10/22 职场文书
文艺委员竞选稿
2015/11/19 职场文书
2016思想纪律作风整顿心得体会
2016/01/23 职场文书
情侣餐厅的创业计划书范本!
2019/07/26 职场文书
MYSQL 运算符总结
2021/11/11 MySQL