博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
SpreadJS 在 Angular2 中支持哪些事件?
阅读量:6757 次
发布时间:2019-06-26

本文共 1376 字,大约阅读时间需要 4 分钟。

图片描述

纯前端表格控件是基于 HTML5 的 JavaScript 电子表格和网格功能控件,提供了完备的公式引擎、排序、过滤、输入控件、数据可视化、Excel 导入/导出等功能,适用于 .NET、Java 和移动端等各平台在线编辑类 Excel 功能的表格程序开发。

在上一篇文章中,我们学习了,今天我们来介绍 SpreadJS 在 Angular2 中支持哪些事件。

首先 Angular2 绑定事件的方法是在 template 中使用"( )"设置绑定事件,然后在导出模块中编写事件触发的方法,像这样:

@Component({

selector: 'my-app',template:   `
`,

})

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();
var range = new GC.Spread.Sheets.Range(-1, 0, -1, columncount );
var rowFilter = new GC.Spread.Sheets.Filter.HideRowFilter(range);
sheet.rowFilter(rowFilter);

这样就完成了在列上面增加绑定的功能。

详细的事件说明,请。

需要注意的是,所有的事件都是绑定在 gc-spread-sheets 标签上的,绑定在其他标签上是无效的。

以上就是如何用 Angular2 构建 SpreadJS 项目的全部内容,相信大家通过第一篇的基础搭建,再参考第二遍的属性与第三篇的事件文档后,已经可以轻松的在 Angular2 的项目中使用 SpreadJS 了。

SpreadJS V10.2 版本即将发布,更多更好的功能尽在新版本中,敬请期待!

登录 ,了解更多。

转载地址:http://izzeo.baihongyu.com/

你可能感兴趣的文章
链接返回上级或事件返回上级
查看>>
ROS学习之catkin_make
查看>>
Android中的颜色值RGB对照表表
查看>>
css单位
查看>>
jquery.validate remote BUG
查看>>
一百元的智能家居——Asp.Net Mvc Api+讯飞语音+Android+Arduino
查看>>
C/C++变量命名规则
查看>>
pandas安装及使用
查看>>
Linux SHELL if 命令参数说明
查看>>
Python的构造函数和析构函数,对象和类的变量不一样
查看>>
window常用的『运行』命令
查看>>
3G中的A-GPS移动定位技术
查看>>
java第五章:面向对象(oop)
查看>>
Maze
查看>>
激光炸弹
查看>>
9.23 模拟赛
查看>>
static_cast、dynamic_cast、const_cast和reinterpret_cast总结
查看>>
阶段性放弃 wxPython 前的总结
查看>>
Fegla and the Bed Bugs 二分
查看>>
linux 文本处理
查看>>