ngx-datatable在angular5版本下无法实现列的拉伸效果

本文介绍在Angular5项目中使用ngx-datatable遇到的列宽拉伸问题及解决方案。通过修改源码中rxjs_1.fromEvent的调用方式,成功实现了列宽的动态调整。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

项目进行到末期,需要对系统中所有的table列的宽度进行拉伸,之前用的ngx-datatable进行表格的渲染,但是由于项目开发的时间太久,目前还是用的angular5的版本,在使用ngx-datatable的过程中发现无法对列进行拉伸,报如下错误:

rxjs_1.fromEvent is not a function

然后新建一个angular7的项目发现就无此问题,可以正常拉伸列,以为是ngx-datatable对angular5版本拉伸不支持,一度想把项目从angular5升级到7,但是项目依赖的很多第三库又不支持angular7,所以陷入了进退两难的状态,如果要升级到7就会有很多地方要重写,而且使用的ant的模板也要整体来更换标签,saas系统里面之前踩了很多坑,怕升级到7之后会遇到其他的坑,而且时间也不允许再整体重写。然后折中的使用了jq里面的拉伸插件,虽然解决了拉伸的问题,但是表头固定又陷入了一个坑,表头固定就无法支持列的拉伸,这个囧啊…(因为老板在web端的表格要求不显示分页,table要进行滚动加载,所以表头必须要固定在顶部,否则无法看到每项的标题)

然后这条路也走不通,就还是想想看看ngx-datatable的源码吧,看报错的fromEvent是怎么回事,在release/index.js报错的第5800行发现是这样使用的

var mouseup = rxjs_1.fromEvent(document, 'mouseup');

既然报这个错那就说明rxjs_1没有这个方法,好吧继续查看rxjs_1是什么东西发现它就是rxjs,在5761行

var rxjs_1 = __webpack_require__("rxjs")

然后查看文档发现是这样使用的


fromEvent
语法
Rx.Observable.fromEvent(element, eventName, [selector])

功能: 将一个元素上的事件转化为一个Observable

注意: 使用jQuery,Zepto,Backbone.Marionette,AngularJS和Ember.js的库方法,并且如果不存在,则回退到本地绑定。 如果您使用AMD,您可能需要将这些库作为RxJ的依赖关系包括在requirejs配置文件中。 当决定使用哪个库时,RxJ将尝试检测它们的存在。

eg:

var clicks = Rx.Observable.fromEvent(document, 'click');

参考上面写法把ngx-datatable的源码修改成下面的,问题解决,可以拉伸列了

var mouseup = rxjs_1.Observable.fromEvent(document, 'mouseup');
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值