SpreadJS 在 Angular2 中支持哪些事件?
SpreadJS 纯前端表格控件是基于 HTML5 的 JavaScript 电子表格和网格功能控件,提供了完备的公式引擎、排序、过滤、输入控件、数据可视化、Excel 导入/导出等功能,适用于 .NET、Java 和移动端等各平台在线编辑类 Excel 功能的表格程序开发。
在上一篇文章中,我们学习了SpreadJS 在 Angular2 中支持绑定的属性,今天我们来介绍 SpreadJS 在 Angular2 中支持哪些事件。
首先 Angular2 绑定事件的方法是在 template 中使用"( )"设置绑定事件,然后在导出模块中编写事件触发的方法,像这样:
@Component({ selector: 'my-app', template: `<gc-spread-sheets (workbookInitialized)= "workbookInit($event)" > </gc-spread-sheets>`, }) export class AppComponent { workbookInit (args) { //do something } }
其中 $event 为 Angular2 的关键字,类似于 window.event,SpreadJS 对 $event 做了一些扩展,如果需要在事件中对 SpreadJS 相关的处理,那么可以传入 $event 来获取事件触发的默认参数,例如:
workbookInitialized 事件中传入 $event 参数后,在可以通过 args.spread 获取 spread 的实例对象。这里对workbookInitialized事件做一个说明,workbookInitialized中可以通过 args.spread 获取 spread 对象,通过 spread 对象理论上我们可以在这里做任何 SpreadJS 功能的事情,这里的事情是不通过 Angular2 来进行处理的。这里可以做一些 Angular2 中不支持绑定的 SpreadJS 功能,例如:
Angular2 支持的 SpreadJS 属性中没有筛选功能,那么如果我们要在 Angular2 的工程中实现一个列的筛选功能我们应该怎么做呢?以上面的代码为例,我们可以在 workbookInit 方法中使用:
var spread = args.spread; var sheet = spread.getActiveSheet(); var columncount = sheet.getColumnCount(); , , -, columncount ); var rowFilter = new GC.Spread.Sheets.Filter.HideRowFilter(range); sheet.rowFilter(rowFilter);
这样就完成了在列上面增加绑定的功能。
详细的事件说明,请参考博客。
需要注意的是,所有的事件都是绑定在 gc-spread-sheets 标签上的,绑定在其他标签上是无效的。
以上就是如何用 Angular2 构建 SpreadJS 项目的全部内容,相信大家通过第一篇的基础搭建,再参考第二遍的属性与第三篇的事件文档后,已经可以轻松的在 Angular2 的项目中使用 SpreadJS 了。
SpreadJS V10.2 版本即将发布,更多更好的功能尽在新版本中,敬请期待!
登录 SpreadJS 官网,了解更多。
SpreadJS 在 Angular2 中支持哪些事件?的更多相关文章
- SpreadJS 在 Angular2 中支持绑定哪些属性?
SpreadJS 纯前端表格控件是基于 HTML5 的 JavaScript 电子表格和网格功能控件,提供了完备的公式引擎.排序.过滤.输入控件.数据可视化.Excel 导入/导出等功能,适用于 .N ...
- Spring中ApplicationContext对事件的支持
Spring中ApplicationContext对事件的支持 ApplicationContext具有发布事件的能力.这是因为该接口继承了ApplicationEventPublisher接口. ...
- IOS中input键盘事件支持的解决方法
欢迎大家去我的网站详细查看http://genghongshuo.com.cn/ IOS中input键盘事件keyup.keydown.等支持不是很好, 用input监听键盘keyup事件,在安卓手机 ...
- 深刻理解:C#中的委托、事件
C#中的事件还真是有点绕啊,以前用JavaScript的我,理解起来还真是废了好大劲!刚开始还真有点想不明白为什么这么绕,想想和JS的区别,最后终于恍然大悟! C#中事件绕的根本原因: C#的方法,它 ...
- 解决Firefox/Opera 不支持onselectstart事件实现不允许用户select
在IE/Safari/Chrome中我们可以使用onselectstart事件来阻止用户选定元素内文本,本文为大家解决下火狐中如何实现不能选择,由此需求的朋友可以参考下,希望对大家有所帮助 ...
- 关于ios苹果系统的中的右键事件,查遍了全网都没有的小技巧。
前阵子公司要求写一套手机端,兼容各种平台和系统,当然,pc端也没有放过. 我用了bootstrap框架和jq.在安卓中的右键事件只需要取消浏览器默认事件,然后长按就可以触发pc端的右键事件,非常好,一 ...
- vlc 在ie11 中的addEventListener事件不触发
在vlc控件中触发一事件,在IE11之前的版本使用attachEvent注册一个回调函数后IE11可以捕获到事件,但IE11中提示attachEvent不支持.经查询发现IE11已经去掉了attach ...
- HTML5中新添加事件
HTML5中新添加了很多事件,但是由于他们的兼容问题不是很理想,应用实战性不是太强,所以在这里基本省略,咱们只分享应用广泛兼容不错的事件,日后随着兼容情况提升以后再陆续添加分享.今天为大家介绍的事件主 ...
- 【转】C# 中的委托和事件
阅读目录 C# 中的委托和事件 引言 将方法作为方法的参数 将方法绑定到委托 事件的由来 事件和委托的编译代码 委托.事件与Observer设计模式 .Net Framework中的委托与事件 总结 ...
随机推荐
- 开发人员不可不看的 OBD通讯协议知识
OBD-II Network Standards» J1850 VPW– Adopted by GM; also known as Class 2.– Adopted by Chrysler (kno ...
- [CF960F]Pathwalks
题目大意:给你一张$n$个点$m$条边的带权有向图,可能有重边和自环.边会按照顺序给出.让你求出一条最长的路径,使得路径上的边满足边权和出现的时间严格递增.路径可以重复经过同一个点. 想办法把它转化成 ...
- java如何调用接口 2
在实际开发过程中,我们经常需要调用对方提供的接口或测试自己写的接口是否合适,所以,问题来了,java如何调用接口?很多项目都会封装规定好本身项目的接口规范,所以大多数需要去调用对方提供的接口或第三方接 ...
- 解题报告:hdu 1005 number subsequent
2017-09-06 20:35:59 writer:pprp 本来以为这是一道水题,写了一个递归就赶紧交上去了, 结果超时了,看看数据范围100000000,肯定把栈给爆了 想用记忆化的方法,但是虽 ...
- LightOJ 1341 Aladdin and the Flying Carpet(唯一分解定理)
http://lightoj.com/volume_showproblem.php?problem=1341 题意:给你矩形的面积(矩形的边长都是正整数),让你求最小的边大于等于b的矩形的个数. 思路 ...
- GridControl 史上最全的资料(一)
GridControl详解(一)原汁原味的表格展示 Dev控件中的表格控件GridControl控件非常强大.不过,一些细枝末节的地方有时候用起来不好找挺讨厌的.使用过程中,多半借助Demo和英文帮助 ...
- mac 下如何建立vue-cli项目
command+space : terminal //检测是否存在node node -v //检测是否带有npm安装管理工具 npm -v //具备进行下一步 //在documnets下建立vue文 ...
- 数据库访问辅助类SqlHelper
程序访问数据库需要进行的操作有创建与某个指定数据库的连接, 然后打开创建好的连接,创建执行指令(也就是sql执行代码), 最后执行指令,关闭创建的连接,释放资源. ado.net是一组用于和数据源进行 ...
- CSS元素隐藏的11种方法
{ display: none; /* 不占据空间,无法点击 */ } { visibility: hidden; /* 占据空间,无法点击 */ } { position: absolute; cl ...
- windows service 2008 内存吃尽解决方案
最近用windows2008,发现系统运行一段时间后,内存吃紧,赶紧打开资源查看器,发现当前运行的程序占有内存都很小,后经查资料,原来是被windows2008的文件缓存吃尽了,这是windows20 ...