简体   繁体   English

带箭头按钮的 angular 材料表的水平滚动

[英]Horizontal Scroll for angular material table with arrow buttons

I am using angular material table and my table has lot columns to show, i want to implement next and prev button on hover of left and right side of table and on click user can scroll to the end.我正在使用 angular 材料表,我的表有很多列要显示,我想在表的左侧和右侧的 hover 上实现下一个和上一个按钮,点击用户可以滚动到最后。 I am not able to find any such implementation with Angular material table.我无法在 Angular 材料表中找到任何此类实现。 Please help with any leads.请帮助任何线索。 Attaching a picture and link for the reference.附上图片和链接以供参考。

https://www.jqueryscript.net/table/Mobile-friendly-Scrollable-Table-Plugin-For-jQuery-ScrolTable.html https://www.jqueryscript.net/table/Mobile-friendly-Scrollable-Table-Plugin-For-jQuery-ScrolTable.html

在此处输入图像描述

I don't know this library, but you can always make overlay on the sides with position absolute.我不知道这个库,但你总是可以用 position absolute 在两侧进行叠加。 Then on event click you only need to make something like:然后在事件点击你只需要做这样的事情:

this.tableWrapperRef.nativeElement.scrollBy(100, 0)

Above one should move 100 pixel to the right (didn't test it).上面一个应该向右移动 100 像素(没有测试)。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM