Is there a way to make the horizontal scroll bar move when dragging the column header of ngx-datatable in Angular 4? I have a situation where the first column should trigger the movement of the horizontal scroll bar when dragged from left to right. Any suggestions on how to achieve this? Please assist.
<ngx-datatable
class="material"
[rows]="row"
[columnMode]="'force'"
[headerHeight]="50"
[footerHeight]="50"
[reorderable]="true"
[scrollbarV]="true"
[scrollbarH]="true"
>
<ngx-datatable-column name="Name" [minWidth]="150"
[resizeable]="true">
<ng-template let-column="column" ngx-datatable-header-template >
Name
</ng-template>
<ng-template let-row="row" let-value="value" ngx-datatable-cell-template >
<div>
{{row['Name']}}
</div>
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Address" [minWidth]="150"
[resizeable]="true">
<ng-template let-column="column" ngx-datatable-header-template >
Address
</ng-template>
<ng-template let-row="row" let-value="value" ngx-datatable-cell-template >
<div>
{{row['Address']}}
</div>
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Age" [minWidth]="150"
[resizeable]="true">
<ng-template let-column="column" ngx-datatable-header-template >
Age
</ng-template>
<ng-template let-row="row" let-value="value" ngx-datatable-cell-template >
<div>
{{row['Age']}}
</div>
</ng-template>
</ngx-datatable-column>
</ngx-datatable>