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实现的Email中的收件人效果(按del键删除)
Mar 20 Javascript
jquery乱码与contentType属性设置问题解决方案
Jan 07 Javascript
jQuery列表拖动排列具体实现
Nov 04 Javascript
JavaScript实现移动端滑动选择日期功能
Jun 21 Javascript
BootStrap实现邮件列表的分页和模态框添加邮件的功能
Oct 13 Javascript
基于Vue.js实现简单搜索框
Mar 26 Javascript
VSCode 配置React Native开发环境的方法
Dec 27 Javascript
JS实现二维数组横纵列转置的方法
Apr 17 Javascript
jQuery实现ajax回调函数带入参数的方法示例
Jun 26 jQuery
详解Koa中更方便简单发送响应的方式
Jul 20 Javascript
JS实现的input选择图片本地预览功能示例
Aug 29 Javascript
Element Cascader 级联选择器的使用示例
Jul 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
ThinkPHP快速入门实例教程之数据分页
2014/07/01 PHP
php制作动态随机验证码
2015/02/12 PHP
基于PHP-FPM进程池探秘
2017/10/17 PHP
WEB页子窗口(showModalDialog和showModelessDialog)使用说明
2009/10/25 Javascript
juqery 学习之五 文档处理 包裹、替换、删除、复制
2011/02/11 Javascript
在JavaScript中监听IME键盘输入事件
2011/05/29 Javascript
解析js中获得父窗口链接getParent方法以及各种打开窗口的方法
2013/06/19 Javascript
JavaScrip实现PHP print_r的数功能(三种方法)
2013/11/12 Javascript
js冒泡、捕获事件及阻止冒泡方法详细总结
2014/05/08 Javascript
JavaScript中自定义事件用法分析
2014/12/23 Javascript
基于javascript实现精确到毫秒的倒计时限时抢购
2016/04/17 Javascript
解决jquery无法找到其他父级子集问题的方法
2016/05/10 Javascript
BootStrap select2 动态改变值的方法
2017/02/10 Javascript
bootstrap-table.js扩展分页工具栏(增加跳转到xx页)功能
2017/12/28 Javascript
Openlayers学习之地图比例尺控件
2020/09/28 Javascript
python解析xml模块封装代码
2014/02/07 Python
Python实现读取txt文件并画三维图简单代码示例
2017/12/09 Python
Windows下的Jupyter Notebook 安装与自定义启动(图文详解)
2018/02/21 Python
Django中的forms组件实例详解
2018/11/08 Python
python爬虫获取百度首页内容教学
2018/12/23 Python
Python 函数返回值的示例代码
2019/03/11 Python
python GUI库图形界面开发之PyQt5选项卡控件QTabWidget详细使用方法与实例
2020/03/01 Python
python的Jenkins接口调用方式
2020/05/12 Python
Python并发爬虫常用实现方法解析
2020/11/19 Python
卡塔尔航空官方网站:Qatar Airways
2017/02/08 全球购物
美国瑜伽服装和装备购物网站:Mukha Yoga
2019/02/22 全球购物
理货员的岗位职责
2013/11/23 职场文书
社团成立邀请函
2014/01/08 职场文书
给朋友的道歉信
2014/01/09 职场文书
小学生考试获奖感言
2014/01/30 职场文书
餐饮总经理岗位职责
2014/03/07 职场文书
营销与策划专业求职信
2014/06/20 职场文书
逃课检讨书
2015/01/26 职场文书
泰坦尼克号观后感
2015/06/04 职场文书
2016大学生党校学习心得体会
2016/01/06 职场文书
使用Cargo工具高效创建Rust项目
2022/08/14 Javascript