在Syncfusion Essential JS 2 Grid for Angular 5中按给定顺序对列进行排序

Question

Sorting feature is described under the documentation for syncfusion-ej2 Grid ( https://ej2.syncfusion.com/angular/documentation/grid/api-column.html#sortcomparer ). I have already implemented it in my Angular application. Still, I couldn't find a way to achieve my target as it doesn't work as I expected (May be I am thinking in a wrong way).

I just need to introduce a default sorting to the grid. The sorting has to be implemented on the column 'Status', which can be either “Overdue”, “Planned” or “Completed”. The sort order should follow the same sequence as I have mentioned. Can I achieve it using 'sortComparer' like this? If so, what are the changes that I have to perform on the existing solution, which I have quoted below?

[HTML]

<!-- Status -->
<e-column field="statusDisplay" headerText="Status" width="85" [sortComparer]='sortComparer'>

[TS]

  public sortComparer = (reference: string, comparer: string) => {
    if (reference == "Overdue") {
      return -2;
    }
    else if (reference == "Planned") {
      return -1;
    }
    else if (reference == "Completed") {
      return 1;
    }
    return 0;
  };

Answer 1

Please change your sortComparer definition like below.

public comparer = (reference: string, comparer: string) => {
  if (reference == "Overdue") {
   return -1;
  }
  else if (reference == "Planned") {
    if (comparer == "Overdue") {
      return 1;
    } else {
      return -1;
    }
  }
  else if (reference == "Completed") {
   return 1;
  }
  return 0;
};

http://next.plnkr.co/edit/ihwvd7a6UxXYI1N5?preview