如何在 AG-Grid 中设置日期列的呈现格式？当我查看样本时，我会看到 dd/mm/yyyy 格式的日期，但我的日期列总是以相当长的格式显示，类似于“Sat May 12 2012 01:00:00 GMT+0100 (BST)”。我想要一个 YYYY-MM-dd 的默认格式，让用户能够自己配置他们想要的格式。我发现的示例展示了如何使用比较器和类似的东西进行自定义过滤，但默认设置对我来说很好，除了日期的实际呈现方式。
谢谢， 特洛伊
【问题讨论】：
标签： javascript ag-grid ag-grid-react
【讨论】：
我为此创建了一个单元格渲染器：
cellRendererFormattedDate = params => {
var date = $filter("date")(params.value, 'yyyy-MM-dd h:mm:ss a');
return `<div style="text-align:right;">${date}</div>`;
}
在你的控制器中，确保你已经注入了 $filter。
在你的 columnDefs 中，一定要定义 cellRenderer: cellRendererFormattedDate
【讨论】：
虽然单元格渲染器和值格式化程序可以工作，但我会为这样的列使用 valueGetter -
headerName: "Issue Date",
valueGetter: function dateValueGettter(params) {
var date = $filter("date")(params.getValue("issueDate"), 'yyyy-MM-dd');
return date;
}
上面的例子是使用 Angular 日期过滤器。
使用 value getter 的好处是现在可以基于 value getter 返回的值对此类列进行排序和过滤。
【讨论】：
这是针对 Angular2+ 版本的。如果您在应用程序中使用矩库。那么工作就很简单了
在您的 .ts 文件中：
import * as moment from 'moment';
{
headerName: 'End Date',
field: 'endDateUTC',
minWidth: 80,
maxWidth: 100,
valueFormatter: function (params) {
return moment(params.value).format('yyyy-MM-dd');
},
},
你会得到的输出是：
结束日期： 2019-10-05
还可以为用户配置日期格式：您可以在应用程序的某个位置添加一个下拉列表，并允许他们选择他们的日期样式并使用上面的 valueFormatter 并动态传递函数，其中包含许多可用的日期格式图书馆。
如果您的值是字符串格式：
先转换成Date，然后使用上面的值格式化函数
例子：
this.firstTaskDate = moment(this.firstTaskDate, 'DD/MM/YY')
.utc()
.toDate();
希望这对某些人有所帮助。
【讨论】：