如何使表格列可滾動並在Angular 2中凍結多列？

Question

我有一個表，其中包含3列，需要總是留在左側，幷包含網格的列，其中每個網格元素代表一天一個小時，所以我需要該列可滾動。我嘗試了許多建議的解決方案，但其中大多數都使用絕對位置，這是一個糟糕的笑話，因爲當我使用它時，我失去了桌子的優勢，例如，排的高度變化，那些絕對定位不遵循。另一個問題是該表由幾個Angular 2組件組成，它不僅僅是簡單的html，這使得它更難。有沒有比絕對位置更好的解決方案？

Answer 1

那麼，到底我剛去該解決方案： Fix and Scrollable table structure using html div

它仍然使用絕對柱等固定寬度和利潤，但還有我可以，只要它的工作原理是活。關於代表一排表格的Angular組件元素，我只給了它display: table-row，並簡單地將td標籤放在裏面，所以不再需要使用tr。

Answer 2

也許試試position: sticky;但是沒有代碼，很難看出問題出在哪裏。

Answer 3

我做了這個方法。我不會爲垂直和水平方向工作。

https://plnkr.co/edit/MWFJuiWsUoo39xbCwAKI?p=preview

onScrollA($evt) { 
    this.divC.nativeElement.scrollLeft = evt.srcElement.scrollLeft; 
}