虚拟滚动数据表PrimeNG在滚动时不会在表的整个高度中显示行

时间:2018-11-13 09:20:06

标签: lazy-loading primeng-datatable virtualscroll

我使用数据表PrimeNG的虚拟滚动。 当我滚动表时,表已滚动,但是表未加载它必须加载的所有行。 我将显示它:

开始: start mode

滚动后: After scroll

即使我有更多行,我也看不到所有行。 我的代码: html:

   <p-dataTable #dt [virtualScroll]="virtualScroll" [emptyMessage]="'TABLE.EMPTY_MESSAGE'|translate" #dt [rows]="rows" [paginator]="paginator"
        (onLazyLoad)="loadLazy($event)" [pageLinks]="3" [scrollable]="true" loadingIcon="fa-spinner" [editable]="editable" [styleClass]="paginator?'paginator': enableFilter?'scroll filter-table':'scroll'"
        [totalRecords]="virtualScroll?totalRecords:null" [globalFilter]="gb" [value]="displayList1" [lazy]="virtualScroll"
        [loading]="loading" resizableColumns="true" [(selection)]="selectedItem" (onRowDblclick)="importButton?'':onRowDblclick($event.data)"
        [expandableRows]="showExpander" [expandedRows]="expandedRows" (onRowSelect)="onrowSelect($event)" (onRowClick)="selectRow($event);onrowSelect($event)"
        (onRowUnselect)="onRowUnSelect($event)" [rowStyleClass]="rowStyleClass" [selectionMode]="(enableSelect&&!showSelectColumn)?(multiSelect?'multiple':'single'):''"
        [metaKeySelection]="false" (onHeaderCheckboxToggle)="onHeaderCheckboxToggle($event)">

类型脚本:

 loadLazy(event: LazyLoadEvent) {
this.filters = event.filters;
this.loading = true;
setTimeout(() => {
  this.loading = false;
  if (this.displayList) {
    let list = this.displayList.filter(row => this.filterField(row, event.filters));
    this.displayList1 = list.slice(event.first, (event.first + event.rows));
    this.totalRecords = list.length;
  }
}, 250);

}

0 个答案:

没有答案