Ag-grid 日期过滤器日期选择器未在边缘加载（在 chrome 中工作）答案

【问题标题】：Ag-grid date filter datepicker not loading in edge (works in chrome)Ag-grid 日期过滤器日期选择器未在边缘加载（在 chrome 中工作）
【发布时间】：2020-04-07 03:02:48
【问题描述】：

我有一个使用过滤器的日期字段：agDateColumnFilter

当我在 chrome 中加载网格并选择过滤此日期字段时，显示的对话框包含“日期”类型的输入，允许我打开日期选择器。

当我在 Microsoft Edge 中执行完全相同的操作时，对话框中会呈现“文本”类型的输入，并且我无法打开日期选择器。尽管 Edge 支持“日期”类型的输入。

有谁知道如何强制它呈现“日期”类型的输入，或者是否有一种方法可以使用一些自定义 html 定义自定义过滤器，我可以放置自定义日期选择器或其他东西？

我目前使用的版本是：

"ag-grid-community": "20.1.0",
"ag-grid-enterprise": "20.1.0"

【问题讨论】：

标签： javascript datepicker ag-grid

【解决方案1】：

查看 github repo for ag grid 中 defaultDateComponent 的源代码，我可以看到将输入类型转换为 date 的以下逻辑

if (_.isBrowserChrome() || (params.filterParams && params.filterParams.browserDatePicker)) {
    if (_.isBrowserIE()) {
        console.warn('ag-grid: browserDatePicker is specified to true, but it is not supported in IE 11, reverting to plain text date picker');
    } else {
        this.eDateInput.type = 'date';
    }
}

要设置的缺失过滤器参数是browserDatePicker。在参数中将其设置为 true 现在会在 Edge 中显示一个日期选择器：

{
    headerName: 'My date field',
    field: 'dateField',
    sortable: true,
    filter: 'agDateColumnFilter',
    filterParams: {
      browserDatePicker: true
    }
  }

【讨论】：