Column header not aligned with the body while scrolling horizontally in ngx-datatable in mobile apps

I have an ionic mobile application where i am rendering one ngx-datatable. The issue is while horizontally scrolling the column headers scroll slower than the table body. It looks very bad. Kindly help if anyone has faced this issue.

See the issue here issue demo

I have tried wrapping the content, adding css to the scroller and using fixed widths to the columns, but no success till now.

My html code :

<ion-content >
<ngx-datatable class="fullscreen" [ngClass]="tableStyle" [rows]="rows" [sortType]="'single'" [reorderable]="true" [scrollbarH]="true" [columnMode]="columnMode" [headerHeight]="50" [footerHeight]="50" [rowHeight]="'auto'" [summaryRow]="true" [summaryPosition]="'bottom'" [limit]="10">
  <ngx-datatable-column *ngFor="let key of keys" [prop]="key"></ngx-datatable-column>
</ngx-datatable>

I need the columns to move smoothly aligned with the content of the table while i scroll it horizontally.