angular - 如何根据可观察值设置primeng表的默认排序顺序

Question

我有p-table可排序的列。但是，最初我希望表格按特定列排序，我使用sortFiled它。但是这个专栏直到运行时才知道。这是表格的一个片段：

<p-table [value]="offers" sortField="totalPrice">
    <ng-template pTemplate="header">
       <tr>
          <th pSortableColumn="shopName">Name
              <p-sortIcon field="shopName"></p-sortIcon>
          </th>
          <th pSortableColumn="unitPrice">Unit price
              <p-sortIcon field="unitPrice"></p-sortIcon>
          </th>
          <th pSortableColumn="totalPrice">Total price
              <p-sortIcon field="totalPrice"></p-sortIcon>
          </th>
       </tr>
   </ng-template>
   <ng-template pTemplate="body"> .... </ng-template>
</p-table>

我需要根据可观察的值指定列，如下所示，但这似乎不起作用。

 <p-table [value]="offers" sortField="(isRelventPrice$ | async)? totalPrice : unitPrice">

任何帮助将不胜感激，谢谢。

标签： angularprimengprimeng-datatable

Answer 1

sortField是当前选定的过滤列，将在任何值更改时更新。

您可以将其设置为简单字符串

<p-table [value]="offers" sortField="totalPrice">...<p-table>

在数据绑定的情况下，您需要使用curly brackets []

<p-table [value]="offers" [sortField]="totalPriceValue">...<p-table>

对于你来说 isRelventPrice$ 这会起作用

 <p-table 
    [value]="offers" [sortField]="(isRelventPrice$ | async)? 'totalPrice' : 'unitPrice'">
....
</p-table>

检查这个演示

角度绑定语法