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 相关文章推荐
javascript web页面刷新的方法收集
Jul 02 Javascript
jQuery模仿单选按钮选中效果
Jun 24 Javascript
js基于cookie记录来宾姓名的方法
Jul 19 Javascript
AngularJS的ng Http Request与response格式转换方法
Nov 07 Javascript
详解node单线程实现高并发原理与node异步I/O
Sep 21 Javascript
angularJs select绑定的model取不到值的解决方法
Oct 08 Javascript
利用js-cookie实现前端设置缓存数据定时失效
Jun 18 Javascript
原生js实现抽奖小游戏
Jun 27 Javascript
jQuery子选择器与可见性选择器实例分析
Jun 28 jQuery
微信小程序tabBar设置实例解析
Nov 14 Javascript
在vue中配置不同的代理同时访问不同的后台操作
Sep 11 Javascript
详解ES6 扩展运算符的使用与注意事项
Nov 12 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
使用php统计字符串中中英文字符的个数
2013/06/23 PHP
php实现将wav文件转换成图像文件并在页面中显示的方法
2015/04/21 PHP
thinkphp3.2实现上传图片的控制器方法
2016/04/28 PHP
PHP5中使用mysqli的prepare操作数据库的介绍
2019/03/18 PHP
thinkphp5 框架结合plupload实现图片批量上传功能示例
2020/04/04 PHP
js数组的操作详解
2013/03/27 Javascript
js中如何把字符串转化为对象、数组示例代码
2013/07/17 Javascript
js实现无需数据库的县级以上联动行政区域下拉控件
2013/08/14 Javascript
js实现iPhone界面风格的单选框和复选框按钮实例
2015/08/18 Javascript
Markdown与Bootstrap相结合实现图片自适应属性
2016/05/04 Javascript
BootStrap Table 获取同行不同列元素的方法
2016/12/19 Javascript
JavaScript 中 apply 、call 的详解
2017/03/21 Javascript
JS 调试中常见的报错问题解决方法
2017/05/20 Javascript
switchery按钮的使用方法
2017/12/18 Javascript
vue使用中的内存泄漏【推荐】
2018/07/10 Javascript
vue 优化CDN加速的方法示例
2018/09/19 Javascript
vue 左滑删除功能的示例代码
2019/01/28 Javascript
jquery实现的分页显示功能示例
2019/08/23 jQuery
HTML+JS实现“代码雨”效果源码(黑客帝国文字下落效果)
2020/03/17 Javascript
浅谈JavaScript中this的指向问题
2020/07/28 Javascript
javascript使用canvas实现饼状图效果
2020/09/08 Javascript
Python3中多线程编程的队列运作示例
2015/04/16 Python
Python中常用的内置方法
2019/01/28 Python
python过滤中英文标点符号的实例代码
2019/07/15 Python
Python包,__init__.py功能与用法分析
2020/01/07 Python
Pycharm远程连接服务器并实现代码同步上传更新功能
2020/02/25 Python
Python3标准库glob文件名模式匹配的问题
2020/03/13 Python
Tensorflow中k.gradients()和tf.stop_gradient()用法说明
2020/06/10 Python
python将字典内容写入json文件的实例代码
2020/08/12 Python
Python实现扫码工具的示例代码
2020/10/09 Python
戴森台湾线上商城:Dyson Taiwan
2018/05/21 全球购物
中科软笔试题和面试题
2014/10/07 面试题
质检部职责
2013/12/28 职场文书
医德医风自我评价
2014/09/19 职场文书
2014年青年志愿者工作总结
2014/12/09 职场文书
提取视频中的音频 Python只需要三行代码!
2021/05/10 Python