拖动ngx-datatable,Angular4的列时如何滚动水平滚动条

问题描述 投票:0回答:1

我正在尝试在拖动ngx-datatable的列标题时滚动水平滚动条。我正在使用Angular4。在我的ngx-datatable中有水平滚动条,当我从左向右拖动第一列时,则水平滚动条应该当我从左向右拖动ngx-datatable列时,如何移动水平滚动条。请帮我

 <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>
angular typescript ngx-datatable
1个回答
1
投票

需要这两个属性

[scrollbarV] =“true”[scrollbarH] =“true”

并添加你的组件css或global style.css这个类:

.material {height:550px}

如果你想改变它,那么“material”是你的ngx-datatable类。

© www.soinside.com 2019 - 2024. All rights reserved.