当p列使用ng-template时,排序p-dataTable不起作用

时间:2019-05-06 18:48:16

标签: angular angular-template primeng-datatable

我正在尝试对具有模板的列进行排序。我的保证是,当一列使用模板时,应通过响应排序事件来完成排序。

<p-column field="activityName" [sortable]="true" (onSort)="onNameSorting($event)">
  <ng-template let-col let-activity="rowData" pTemplate="body">
   //..
  </ng-template>
</p-column>

但是,当我在事件处理程序中放置一个断点时,没有任何反应。我想念什么吗?

onNameSorting(e){
  debugger;       //--> the breakpoint is not being hit
  //...
}

感谢您的帮助

编辑

遇到断点,正在执行排序。但是 dataTable 中没有反映出任何变化。

onNameSorting(e, dt){
  debugger;              //This break point is being hit now.
  if(!!e.order && e.order > 0){
     this.filteredItems = this.filteredItems
        .sort((a, b) => (a.activityName < b.activityName) ? -1 : 1);
  }else{
     this.filteredItems = this.filteredItems
        .sort((a, b) => (a.activityName > b.activityName) ? -1 : 1);
  }
}

1 个答案:

答案 0 :(得分:1)

我假设您正在使用旧的主要数据表。在该版本中,没有(onSort)="onNameSorting($event)"绑定到p-column。将其移至p-dataTable

例如:-

<p-dataTable scrollable="true" [value]="_rowList" [selectionMode]="selectionMode"
             [responsive]="true" (selectionChange)="rowSelectionChange($event)"
             (click)="rowSingleClick($event)" (dblclick)="rowDoubleClick($event)" [(selection)]="_selectedEntity"
<!-- refer to the next line, above lines are bunch of attributes -->
             (onSort)="sortData($event, dt)"[sortField]="sortField" [sortOrder]="sortOrder" #dt>
<p-column field="activityName">
  <ng-template let-col let-activity="rowData" pTemplate="body">
   //..
  </ng-template>
</p-column>
</p-dataTable>

建议:他们已经推出了新的PrimeNg Turbo table。它更容易,更快。