动态加载数据时分页p表不排序

Question

这是p表分页和排序的代码。分页工作完美，但排序似乎不起作用。每个页面的数据都是通过 api 调用动态填充的，因此如果不触发 onPage 事件，其余数据将不可用。仅显示定义的行数。

    <p-table *ngIf="showItemTable"
                    #dt
                    [value]="itemList"
                    dataKey="id"
                    [rowHover]="true"
                    [rows]="5"
                    [paginator]=“true”
                    [filterDelay]="0"
                    [globalFilterFields]="['id’,’type']"
                    [rowsPerPageOptions]="[5,10]"
                    [loading]="isLoading"
                    [showLoader]="false"
                    [lazy]="true"
                    (onPage)="paginate($event)"
                    [totalRecords]="totalRecords"
                    [resizableColumns]="true"
                    [autoLayout]="true"
                    title=“Items"
                    role="table"
                >

此处应用排序。表中显示的数据应按“类型”列排序。

                    <ng-template pTemplate="header">
                        <tr>
                            <th pSortableColumn="type">
                                Type
                                <p-sortIcon field="type"></p-sortIcon>
                            </th>
                            <th>ID</th>
                            <th>Status</th>
                            <th>Name</th>
                        </tr>
                    </ng-template>
                    

桌体。这里没有变化。

                    <ng-template pTemplate="body" let-item>
                        <tr>
                           <td>
                                <div class="item-id">{{ item?.type}} </div>
                            </td>
                           <td>
                                <div class="item-id">{{ item?.id}} </div>
                            </td>
                            <td>
                                <div class="item-id">{{ item?.status}} </div>
                            </td>
                            <td>
                                <div class="item-id">{{ item?.name}} </div>
                            </td>
                        </tr>
                    </ng-template>
                </p-table>

我尝试添加自定义排序（https://stackblitz.com/edit/primeng-tablesort-demo?file=README.md）但仍然无法使其工作，即使使用分页，这个 stackblitz 示例似乎去工作。 （尽管排序时它会跨页移动）。

Answer 1

试试这些。您可以通过本文获得有关表排序的更多知识。 https://www.primefaces.org/primeng-v14-lts/table/sort

       <tr>
            <th pSortableColumn="code" style="width:20%">Code <p-sortIcon field="code"></p-sortIcon></th>
            <th pSortableColumn="name" style="width:20%">Name <p-sortIcon field="name"></p-sortIcon></th>
            <th pSortableColumn="category" style="width:20%">Category <p-sortIcon field="category"></p-sortIcon></th>
            <th pSortableColumn="quantity" style="width:20%">Quantity <p-sortIcon field="quantity"></p-sortIcon></th>
            <th pSortableColumn="price" style="width:20%">Price <p-sortIcon field="price"></p-sortIcon></th>
        </tr>