时间戳

首页 > 解决方案 > 带有分页器附加页面的 PrimeNG p-table 忽略“行”

primeng - 带有分页器附加页面的 PrimeNG p-table 忽略“行”

问题描述

我正在使用带有 [paginator]=true 和 rows=[10] 的 PrimeNGs p-table。在我的测试集中，我的数据有 10000 个项目长（测试它在大型数据集上的工作情况）。第一页正确显示 10 个项目，但是当我单击下一步或特定页码时，第一次显示 1000 个项目，第二次更改页面时，它显示 2000 个以上（总共 3000 个）等等...

任何人都知道我做错了什么

<p-table #dt [value]="items" [paginator]="true" rows="10" [globalFilterFields]="['id','hostname','logKeepDays']">
    <ng-template pTemplate="caption">
        <div style="text-align: right">        
            <i class="fa fa-search" style="margin:4px 4px 0 0"></i>
            <input type="text" pInputText size="50" placeholder="Filter..." (input)="dt.filterGlobal($event.target.value, 'contains')" style="width:auto">
        </div>
    </ng-template>
    <ng-template pTemplate="header">
        <tr>
          <th class="hidden-md-down" [pSortableColumn]="'id'">ID <p-sortIcon [field]="'id'"></p-sortIcon></th>
          <th [pSortableColumn]="'hostname'">Host <p-sortIcon [field]="'hostname'"></p-sortIcon></th>
          <th [pSortableColumn]="'active'">Active <p-sortIcon [field]="'active'"></p-sortIcon></th>
          <th [pSortableColumn]="'logKeepDays'">Log Days <p-sortIcon [field]="'logKeepDays'"></p-sortIcon></th>
        </tr>
    </ng-template>
    <ng-template pTemplate="body" let-item>
        <tr>
          <td class="hidden-md-down">{{item.id}}</td>
          <td>{{item.hostname}}</td>
          <td>{{item.active}}</td>
          <td>{{item.logKeepDays}}</td>
        </tr>
    </ng-template>
</p-table>

标签： primeng

解决方案

我没有行周围的方括号。将 rows="10" 更改为 [rows]="10" 修复了它。奇怪的是它可以在没有方括号的第一页上工作。

但万一有人遇到这个问题。

推荐阅读