【问题标题】:ag-grid comparator function not being triggered未触发 ag-grid 比较器功能
【发布时间】:2020-10-07 06:41:19
【问题描述】:

我将 ag-grid 9.X 与 angularJs 一起使用,当尝试为日期列设置比较器功能时,它不会被触发。

      {
      headerName: 'Date',
      field: 'lastDate',
      width:100,
      sortable: true,
      comparator: dateComparator,
      }

我还设置了 enableSorting: true 。该功能是否有可能在该版本的 ag-grid 中不可用?

谢谢!

【问题讨论】:

  • 你试过this.dateComparator吗?

标签: javascript angularjs ag-grid ag-grid-angular


【解决方案1】:

所以,由于我无法让比较器功能工作,我使用以下技巧对日期列进行排序:

  • 确保输入网格的原始数据具有该列的 Javascript Date 对象而不是字符串(以便 ag-grid 的排序算法(使用 ">" 运算符)可以将这些日期作为日期而不是字符串进行比较) 示例:

            data.forEach(function(obj,i){
             let dateStr = obj.date
             let year = dateStr.substring(0, 4)
             let month =  dateStr.substring(5, 7)
             let day = dateStr.substring(8, 10)
             let time =  dateStr.substring(11, 21)
             let date = new Date(year+"-"+month+"-"+day+" "+time)
             data[i].date = date
            })
            $scope.gridConfig.data = data
    

其实我通过这个问题了解到的是,ag-grid 排序算法不会作用于cellRenderer 渲染的数据,也不会作用于valueGetter。它实际上使用了原始数据。

  • 可选:这些列将以 Javascript 日期对象格式呈现。 如果您希望这些日期具有特定格式,您可以使用该列的 cellRenderer 函数或 valueGetter 将这些日期解析回原始格式。不用担心,排序不会受到影响,因为它仍然会使用原始数据中的日期对象。

【讨论】:

    【解决方案2】:

    我认为您的比较器的实现是问题所在。你在使用静态函数吗?如果不试试这个,看看它是否有效。

    {
        headerName: 'Date',
        field: 'lastDate',
        width:100,
        sortable: true,
        comparator: (a, b) => {
            //implement your comparator here.
        },
    }
    

    【讨论】:

    • 我不确定我是否理解这个答案与问题中的代码有何不同。我会假设 OP 知道比较器函数的正确签名;并且问题表明比较器根本没有被触发。
    • 虽然此代码可以解决 OP 的问题,但最好包含关于您的代码如何解决 OP 问题的说明。这样,未来的访问者可以从您的帖子中学习,并将其应用到他们自己的代码中。 SO 不是编码服务,而是知识资源。此外,高质量、完整的答案更有可能获得支持。这些功能,以及所有帖子都是独立的要求,是 SO 作为一个平台的一些优势,使其与论坛区分开来。您可以编辑以添加其他信息和/或使用源文档补充您的解释。
    【解决方案3】:

    您必须添加以下内容:

    sort: 'asc',
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2016-06-19
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2019-10-26
      • 1970-01-01
      • 2018-11-18
      • 2020-04-06
      相关资源
      最近更新 更多