修改角度网格组件格式导出列

Modify angular grid component format exported columns

本文关键字：格式 组件 网格 修改      更新时间：2023-09-26

我在代码中使用 ag-grid 组件，并希望确保日期列在导出为 CSV 时根据客户需求进行格式化。当前使用 js Date 对象的默认格式。代码可以在这里找到：

https://github.com/ceolter/ag-grid/blob/master/src/ts/csvCreator.ts

我可以直接对代码进行以下更改，但这显然是一种不好的做法。我对 JavaScript 相当陌生，想知道是否有一种标准方法来扩展/覆盖这样的库中的功能。

提议的更改

（请注意，这显示了我对js版本所做的更改，而不是使用ts的github版本）：

--- Common/scripts/agGrid/ag-grid.js    (revision b0e7d54e61e6371b0cab94428cb4329f9f62db11)
+++ Common/scripts/agGrid/ag-grid.js    (revision )
@@ -1848,7 +1848,11 @@
+                var exportDateAs = function(dt){if (dt instanceof Date)
+                    return dt.getFullYear() + "/" + (dt.getMonth()+1) + "/" + dt.getDate();
+                };
@@ -1883,6 +1887,9 @@
+                            if (valueForCell instanceof Date){
+                                valueForCell = exportDateAs(valueForCell);
+                            }

看起来此功能是在较新版本中添加的：https://www.ag-grid.com/javascript-grid-export/

我的解决方案是手动更新 ag 网格组件中的函数，如下所示。它似乎有效，但不确定它是否是最佳实践。有人愿意发表评论吗？

用我自己的函数替换对象中的函数：

ag.grid.CsvCreator.prototype.getDataAsCsv = agCustom.getDataAsCsv;

新功能 

var agCustom;
(function (agCustom) {
    // This is a modified version of the getDataAsCsv from
    // agGrid to allow date formatting in csv export
    agCustom.getDataAsCsv = function (params) {
        var LINE_SEPARATOR = ''r'n';
...
        var exportDateAs = function(dt){if (dt instanceof Date)
            return dt.getFullYear() + "/" + (dt.getMonth()+1) + "/" + dt.getDate();
...
                else {
                    valueForCell = _this.valueService.getValue(column.colDef, node.data, node);
                    if (valueForCell instanceof Date){
                        valueForCell = exportDateAs(valueForCell);
                    }
...
})(agCustom || (agCustom = {}));
相关文章：