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 相关文章推荐
js弹出div并显示遮罩层
Feb 12 Javascript
jquery自动将form表单封装成json的具体实现
Mar 17 Javascript
JavaScript类型系统之基本数据类型与包装类型
Jan 06 Javascript
Vue中的无限加载vue-infinite-loading的方法
Apr 08 Javascript
Vue实现自定义下拉菜单功能
Jul 16 Javascript
node.js遍历目录的方法示例
Aug 01 Javascript
jQuery中实现text()的方法
Apr 04 jQuery
bootstrap-treeview实现多级树形菜单 后台JSON格式如何组织?
Jul 26 Javascript
Javascript组合继承方法代码实例解析
Apr 02 Javascript
vue v-for出来的列表,点击某个li使得当前被点击的li字体变红操作
Jul 17 Javascript
修改Vue打包后的默认文件名操作
Aug 12 Javascript
jQuery使用hide()、toggle()函数实现相机品牌展示隐藏功能
Jan 29 jQuery
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
PHP4和PHP5性能测试和对比 测试代码与环境
2007/08/17 PHP
PHP has encountered an Access Violation at 7C94BD02解决方法
2009/08/24 PHP
推荐一本PHP程序猿都应该拜读的书
2014/12/31 PHP
浅析Yii2中GridView常见操作
2016/04/22 PHP
Highslide.js是一款基于js实现的网页中图片展示插件
2020/03/30 Javascript
JavaScript 应用类库代码
2008/06/02 Javascript
JavaScript 异步调用框架 (Part 1 - 问题 & 场景)
2009/08/03 Javascript
javascript innerHTML使用分析
2010/12/03 Javascript
推荐40个简单的 jQuery 导航插件和教程(下篇)
2012/09/14 Javascript
JavaScript实现大数的运算
2014/11/24 Javascript
学习Javascript面向对象编程之封装
2016/02/23 Javascript
实例讲解使用原生JavaScript处理AJAX请求的方法
2016/05/10 Javascript
jQuery实现的选择商品飞入文本框动画效果完整实例
2016/08/10 Javascript
JavaScript中省略元素对数组长度的影响
2016/10/26 Javascript
ES6解构赋值的功能与用途实例分析
2017/10/31 Javascript
详解基于Vue-cli搭建的项目如何和后台交互
2018/06/29 Javascript
vue+element 模态框表格形式的可编辑表单实现
2019/06/07 Javascript
webstorm建立vue-cli脚手架的傻瓜式教程
2020/09/22 Javascript
Python基础知识_浅谈用户交互
2017/05/31 Python
python实现基于SVM手写数字识别功能
2020/05/27 Python
python实现word 2007文档转换为pdf文件
2018/03/15 Python
python中datetime模块中strftime/strptime函数的使用
2018/07/03 Python
CSS3实现任意图片lowpoly动画效果实例
2017/05/11 HTML / CSS
法国时尚童装网站:Melijoe
2016/08/10 全球购物
泰国演唱会订票网站:StubHub泰国
2018/02/26 全球购物
护理学毕业生自荐信
2013/10/02 职场文书
小学生打架检讨书
2014/01/26 职场文书
委托书样本
2014/04/02 职场文书
行政专员岗位职责范本
2014/08/26 职场文书
机关作风建设自查报告及整改措施
2014/10/21 职场文书
普通党员整改措施
2014/10/24 职场文书
2014年教研工作总结
2014/12/06 职场文书
电影地道战观后感
2015/06/04 职场文书
篮球赛新闻稿
2015/07/17 职场文书
Go各时间字符串使用解析
2021/04/02 Golang
HTML 里 img 元素的 src 和 srcset 属性的区别详解
2023/05/21 HTML / CSS