Ag-grid ：GroupByColum 排序不适用于数值，它仅提供字符串排序

Question

在我的 ag-grid 中，当我按列进行分组并单击进行排序时，即使对于数值，组也会按字母顺序排序。

有没有办法提供一个取决于分组（行组）列类型的比较器？

要重现该问题： 1. 在下面的朋克中，尝试按年龄行进行分组 2. 按升序或降序排序按组排序 3. 组按字母排序而不是按值排序（排序降序时的年龄顺序为：15,16 ,17,18,19,2,20,200,21,22....)！

链接：https://plnkr.co/edit/FjJOYQgsz46KDQfoNCQF ?p=preview

    export class AppComponent {
      private gridApi;
      private gridColumnApi;

      private columnDefs;
      private defaultColDef;
      private sideBar;
      private frameworkComponents;
      private rowData: [];

      constructor(private http: HttpClient) {
        this.columnDefs = [
          {
            field: "athlete",
            width: 150,
            filter: "agTextColumnFilter",
            sortable: true
          },
          {
            field: "age",
            width: 90,
            sortable: true
          },
          {
            field: "country",
            width: 120,
            sortable: true
          },
          {
            field: "year",
            width: 90,
            sortable: true
          },
          {
            field: "date",
            width: 110
          },
          {
            field: "gold",
            width: 100,
            filter: false
          },
          {
            field: "silver",
            width: 100,
            filter: false
          },
          {
            field: "bronze",
            width: 100,
            filter: false
          },
          {
            field: "total",
            width: 100,
            filter: false
          }
        ];
        this.defaultColDef = { filter: true, sortable: true, enableRowGroup : true };
        this.sideBar = {
          toolPanels: [
            {
              id: "columns",
              labelDefault: "Columns",
              labelKey: "columns",
              iconKey: "columns",
              toolPanel: "agColumnsToolPanel"
            },
            {
              id: "filters",
              labelDefault: "Filters",
              labelKey: "filters",
              iconKey: "filter",
              toolPanel: "agFiltersToolPanel"
            },
            {
              id: "customStats",
              labelDefault: "Custom Stats",
              labelKey: "customStats",
              iconKey: "custom-stats",
              toolPanel: "customStatsToolPanel"
            }
          ],
          defaultToolPanel: "customStats"
        };
        this.frameworkComponents = { customStatsToolPanel: CustomStatsToolPanel };
      }

      onGridReady(params) {
        this.gridApi = params.api;
        this.gridColumnApi = params.columnApi;

        this.http
          .get("https://raw.githubusercontent.com/ag-grid/ag-grid/master/packages/ag-grid-docs/src/olympicWinners.json")
          .subscribe(data => {
            data[10].age = 200;
            data[12].age = 2;
            this.rowData = data;

          });
      }
    }

Answer 1

似乎 ag-Grid 使用默认的 JavaScript 排序定义，这就是为什么它可能不适用于数字或任何其他数据类型。您必须将自定义比较器函数传递给comparator列定义中的属性。

我假设您只需要对年龄列使用该函数。

在下面的代码中，我添加了numberSort，它是年龄列的比较器函数。

constructor(private http: HttpClient) {
  const numberSort = (num1: number, num2: number) => {
    return num1 - num2;
  };
  this.columnDefs = [{
      field: "athlete",
      width: 150,
      filter: "agTextColumnFilter",
      sortable: true,
    },
    {
      field: "age",
      width: 90,
      sortable: true,
      comparator: numberSort
    },
    .
    .
    .
    // other column defs
  ];
  this.defaultColDef = {
    filter: true,
    sortable: true,
    enableRowGroup: true
  };

}

我已经分叉了你的演示并在这里添加了我的更改。