4

我有一个 ag-grid，我正在动态地将数据加载到其中。我启用了列排序，但它不起作用。当我单击列标题时没有任何反应。我不确定问题是什么。下面是我的代码：

    var colobj = {};
    for(i = 0; i< file.fieldMetadata.length; i++){

   var len = file.fieldMetadata[i].name.length;

   colobj = {'headerName' : file.fieldMetadata[i].name, 'field' : file.fieldMetadata[i].name, sortingOrder: ['asc','desc', 'null']};

vm.columnDefs.push(colobj);

    vm.gridOptions.api.setColumnDefs(vm.columnDefs);
    vm.gridOptions.api.setRowData(vm.fileContentsCols);
    vm.gridOptions.enableSorting = true;
4

4 回答 4

3

enableSorting 在这里不起作用。只有调用 api 函数才会起作用。

您必须从一开始就设置 gridOptions.enableSorting = true （而不是在接收数据之后）。

gridOptions 只是初始化的持有者。网格初始化后，api 字段可用于与网格交互，对参数的所有更改都将不起作用。

于 2016-01-07T15:25:14.997 回答
2

将此方法用作您的比较器

numberComparator(aVal, bVal, nodeA, nodeB, isInverted) {

  if (aVal == bVal) {
    return 0;
  }

  if (isInverted == true) {

    if (_.isNil(aVal) || _.isNaN(aVal))
      return -1;

    if (_.isNil(bVal) || _.isNaN(bVal))
      return 1;
  }
  else {

    if (_.isNil(aVal) || _.isNaN(aVal))
      return 1;

    if (_.isNil(bVal) || _.isNaN(bVal))
      return -1;
  }

  return aVal < bVal ? -1 : 1;  
}
于 2020-03-04T18:48:10.930 回答
2

在这里您使用自定义排序，

如果您的行没有与值绑定，那么您使用自定义排序。

         {
            headerName: "Date",
            field: "date",
            //For Custom  Sorting
            comparator: (valueA, valueB, nodeA, nodeB, isInverted) => {
              valueA = moment(valueA).format('DD-MM-YYYY');
              valueB = moment(valueB).format('DD-MM-YYYY');
              if (valueA == valueB) {
                return 0;
              } else {
                return (valueA > valueB) ? 1 : -1;
              }
            },
            cellStyle: { 'text-align': 'left' },
            minWidth: 250,
        }
于 2021-01-01T04:57:41.523 回答
0

对于想知道为什么会在 Angular 中发生这种情况的人：

我遇到了同样的问题，我正在动态设置 enableSorting 和其他布尔值，但在设置 columnDefs 之后。由于这种初始化顺序， enableSorting 不起作用。

我在 columnDefs 之前首先初始化了我的布尔字段，它就像一个魅力：

  ngOnInit(): void {

    /* table setting should be initialed before setting data

{
    "tableHeight": 300,
    "tableClass": "ag-theme-balham",
    "enableSorting": true,
    "animateRows": true,
    "dragDrop": true,
    "enableColResize": true,
    "sortingOrder": ["desc", "asc", null]
  }

*/

     this.configService.getGeneralTableData().subscribe((x) => {
      this.generalTableSettings = x;
    } );

    this.configService.getTableHeaderColumnSettings().subscribe((x) => {
      this.columnDefs = x;
    });
  }

 <ag-grid-angular
    #agGrid
    style="width: 100%; height: 400px;"
    id="myGrid"
    [columnDefs]="columnDefs"
    [class]="generalTableSettings?.tableClass"
    [enableSorting]="generalTableSettings?.enableSorting"
    [animateRows]="generalTableSettings?.animateRows"
    [suppressDragLeaveHidesColumns]="generalTableSettings?.dragDrop"
    [enableColResize]="generalTableSettings?.enableColResize"
    [sortingOrder]="generalTableSettings?.sortingOrder"

    (gridReady)="onGridReady($event)"
    ></ag-grid-angular>
于 2018-06-05T17:07:09.387 回答