如何在Angular6中为ngx-datatable列编写自定义排序方法？答案

【问题标题】：How to write a custom sorting method for ngx-datatable column in Angular6?如何在Angular6中为ngx-datatable列编写自定义排序方法？
【发布时间】：2019-12-20 09:45:25
【问题描述】：

我在 Angular6 项目中定义了一个 ngx-datatable，如下所示，我需要在表格中按以下顺序对国家/地区进行排序。

代码-

<ngx-datatable [rows]="rows" [limit]="20" [rowHeight]="35" [headerHeight]="35" [footerHeight]="35" [scrollbarV]="true"
[columnMode]="'force'" class="material">
<ngx-datatable-column prop="name" name="name">
    <ng-template ngx-datatable-cell-template let-value="value">
        {{value}}
    </ng-template>
</ngx-datatable-column>
<ngx-datatable-column prop="country" name="country">
    <ng-template ngx-datatable-cell-template let-value="value">
        {{value}}
    </ng-template>
</ngx-datatable-column>

Order of the rows should be -  England > America > Russia

我可以按字母顺序排列列，如下所示。

[sorts]="[{prop: 'country'}"

但我需要按上述顺序对它们进行排序。行按此顺序排列。 （英国 > 美国 > 俄罗斯）。

请帮助我在 ngx-databale 中进行排序或使用自定义比较器。谢谢

stackblitz中的示例代码

【问题讨论】：

这种排序叫什么？这里似乎与排序无关。它不称为排序，它是您想要显示数据的方式。您需要为此制定自定义逻辑或其他任何内容。
@SurjeetBhadauriya 按上述顺序而非字母顺序对列进行排序。如果是带有数字的列，则很容易排序。但我需要从特定值中对其进行排序。
@SurjeetBhadauriya yes..sorting 表示，按上述顺序显示行。
你可以尝试在 stackblitz 上创建一个演示
首先使用与county相同的自定义排序函数使用名称对其进行排序，而不是country，检查名称，一旦排序，然后再次调用另一个带有国家的排序函数。您可以使用将属性名称传递给函数的选项来概括排序函数。

标签： angular sorting datatable angular6 ngx-datatable

【解决方案1】：

您可以像下面这样创建自定义比较器功能

  order = ['England', 'America', 'Russia'];

this.rows.sort((propA, propB) => {
       let indexA = this.order.indexOf(propA.country);
       let indexB = this.order.indexOf(propB.country);

       if (indexA > indexB) {

          return 1;
        } else if (indexA < indexB) {

          return -1;
        }

      return 0;
    });

这里是演示 - https://stackblitz.com/edit/ngx-column-reordering-bl4kdh 希望这会有所帮助

【讨论】：

这仅在初始化时起作用。每次点击标题后，数据将默认排序！