html - primeng，p 表列 "reorder"不工作

Question

我正在使用 Primeng table ，并尝试使用列“重新排序”功能，但没有成功。

当我移动一个列时，会显示“箭头”图像，但是当我将列放在其他位置时 - 没有任何反应(该列仍在“先前的位置”)。

<div class="container">
  <p-table #dt [value]="pagedTasks"
           [paginator]="true"
           [rows]="pageSize"
           [first]="first"
           [lazy]="true"
           [totalRecords]="totalRecords"
           [autoLayout]="true"
           (onLazyLoad)="loadTasksLazy($event)"
           [responsive]="true"
           sortField="id"
           sortOrder="-1"
           [reorderableColumns]="true"
           >
   <ng-template pTemplate="caption">
    ...
   /ng-template>
   <ng-template pTemplate="header">
     <tr>
        <th *ngFor="let col of cols" [pSortableColumn]="col.field" pReorderableColumn>
          <div *ngIf="col.field !== 'actions'">
            {{ col.header }}
            <p-sortIcon [field]="col.field"></p-sortIcon>
          </div>
          <div *ngIf="col.field === 'actions'">
            <fa name="file-code"></fa>
          </div>
        </th>
      </tr>
   ...
  </p-table>
</div>

如您所见，我在 p-table 元素中使用了 [reorderableColumns]="true"， 和 pReorderableColumn 在 th 元素上。 我错过了什么吗？

Answer 1

我一直将我的表与 Primeng 站点中的示例进行比较，发现我没有将 cols 数组绑定(bind)到 columns 属性 [列]="列" 在 p-table 元素中。

<p-table
...
[columns]="cols"
>