1

我正在使用primeng p-virtualScroller来实现使用滚动条加载数据。它工作正常。但我面临以下问题:当搜索结果较少时,它会显示滚动条和空列表项。下面是我在 Html 中使用的代码:

 <p-virtualScroller  [(value)]="employeeList" scrollHeight="300px" [itemSize]="20" [rows]="pageSize"
            [(lazy)]="lazyLoading" (onLazyLoad)="loadCarsLazy($event)" [(totalRecords)]="totalEmployees">

            <ng-template let-emp pTemplate="emptymessage" *ngIf="searchResultMsg">
                <span>{{searchResultMsg}}</span>
            </ng-template>
            <ng-template let-emp pTemplate="item" let-odd = odd  *ngIf="searchResultMsg===''">
                <div (click)="selectEmployee(emp)" class="pl-2 search-list"  [class.odd-row]="odd">{{emp.name}} </div>

            </ng-template>

        </p-virtualScroller>

下面是我要解释的问题(见屏幕截图) 在此处输入图像描述

4

1 回答 1

0

我得到了解决上述问题的解决方案。我根据 API(COUNT) 返回的可用记录总数更新 pageSize 变量的值

代码:

  callAPIToSearch(searchValue, rowOffset) {
if (!this.isProcessing) {
  this.isProcessing = true;
  this.empService.searchEmployees(searchValue, rowOffset, this.pageSize).subscribe((apiResp: EmployeeSearchAPIResponse) => {
    if (rowOffset == 0 && apiResp.response.COUNT === 0) {
      this.searchResultMsg = `No record found, Please enter Relationship Manager's Surname and try again.`;
    } else {
      this.totalEmployees = apiResp.response.COUNT;
      if (apiResp.response.COUNT <= 100) {
        this.pageSize = apiResp.response.COUNT
      } else{
        this.pageSize =100;
      }
      this.employeeList = apiResp.response.employees;
    }
    this.isProcessing = false;
  })
} }
于 2020-06-17T11:27:30.553 回答