如何在Primeng数据表格中设置默认排序顺序？

Question

我正在使用 prime-ng 的 dataTable 组件展示用户列表，我希望默认情况下该列表根据第一列进行降序排序，并使 dataTable 显示第一列已经排序。

 <p-dataTable [value]="webUserSummaryList" [rows]="10"  reorderableColumns="true">
    <p-column field="userName" header="Username" [filter]="true" [sortable]="true"></p-column>
    <p-column field="emailAddress" header="Email" [filter]="true" [sortable]="true"></p-column>
    <p-column field="firstName" header="First Name" [filter]="true" [sortable]="true"></p-column>
    <p-column field="lastName" header="Last Name" [filter]="true" filterMatchMode="contains" [sortable]="true"></p-column>
</p-dataTable>   

编辑：我已经找到一种设置默认排序列的方法，即使用sortField="userName"。然而，我仍然无法将列默认为降序。

- Heather92065

Answer 1

我明白了。应该添加这两个属性：

sortField="userName" [sortOrder]="-1"

sortField表示列名，sortOrder可以是1（升序）或-1（降序）。

下面是可行的解决方案：

<p-dataTable [value]="webUserSummaryList" [rows]="10"  reorderableColumns="true" sortField="userName" sortOrder="-1">
<p-column field="userName" header="Username" [filter]="true" [sortable]="true"></p-column>
<p-column field="emailAddress" header="Email" [filter]="true" [sortable]="true"></p-column>
<p-column field="firstName" header="First Name" [filter]="true" [sortable]="true"></p-column>
<p-column field="lastName" header="Last Name" [filter]="true" filterMatchMode="contains" [sortable]="true"></p-column>

- Heather92065

---

排序顺序为倒序。 - sabithpocker

请将您的答案标记为此问题的答案。 - dmoore1181

sortOrder="-1" 对我不起作用，但 [sortOrder]="-1" 是有效的。 - Ramil Aliyev 007

我尝试使用 [sortField]="userName" [sortOrder]="-1"，但它没有起作用。[] 和没有 [] 之间有什么区别吗？ - tryingToLearn

@tryingToLearn 我来晚了，但是使用 []，引号中的部分会被字面解释（在这种情况下是作为数字）。如果没有 []，它将被解释为字符串（"-1"）。 - Carcigenicate

Answer 2

如果您要对多列进行排序，则可以使用以下方式指定初始排序参数（适用于已弃用的DataTable和当前的PrimeNG Table组件）：

[multiSortMeta]="[{field: 'state', order: -1}, {field: 'displayName', order: 1}]"

使用表格组件的例子（PrimeNG 7+）：

<p-table [value]="products2" sortMode="multiple" [multiSortMeta]="[{field: 'code', order: -1}, {field: 'name', order: 1}, {field: 'category', order: -1}]">
  <ng-template pTemplate="header">
    <tr>
      <th pSortableColumn="code">Code <p-sortIcon field="code"></p-sortIcon></th>
      <th pSortableColumn="name">Name <p-sortIcon field="name"></p-sortIcon></th>
      <th pSortableColumn="category">Category <p-sortIcon field="category"></p-sortIcon></th>
      <th pSortableColumn="quantity">Quantity <p-sortIcon field="quantity"></p-sortIcon></th>
      <th pSortableColumn="price">Price <p-sortIcon field="price"></p-sortIcon></th>
    </tr>
  </ng-template>
  <ng-template pTemplate="body" let-product>
    <tr>
      <td>{{product.code}}</td>
      <td>{{product.name}}</td>
      <td>{{product.category}}</td>
      <td>{{product.quantity}}</td>
      <td>{{product.price | currency: 'USD'}}</td>
    </tr>
  </ng-template>
</p-table>

- Bob

---

谢谢。我需要在多个排序顺序上设置默认排序。这个方法很有效。 :) - Sourav