具有固定标题和第一列的Angular2表

Question

我已经尝试了很多方法来实现它，比如在指令中使用bind scroll或者使用jQuery，但是，我不确定我的表是否包含太多的数据/列。当滚动发生时，固定的左侧和标题会滞后很多。

如果有任何开发人员可以给我一些建议，我感激不尽。

[更新]

我首先尝试将thead和tbody分开以使tbody可滚动，然后对tbody进行指令。然后我使用下面的代码处理滚动，似乎更新太慢，因此固定元素无法跟随。除了整体滚动似乎表现不佳，它也落后了。

@HostListener('scroll', ['$event'])
onScroll(event: Event): void { 

    this.thead.style.left = this.tbody.scrollLeft * -1 + 'px';

    for (let th of this.firstColumns) {
        th.style.left = this.tbody.scrollLeft + 'px';
    }
}