реализация пользовательского фильтра ag-grid - PullRequest
Новая
       18

реализация пользовательского фильтра ag-grid

1 голос
/ 12 марта 2019

Я хотел бы создать реагирующий фильтр с плавающей датой, который работает точно так же, как фильтр по умолчанию. Фильтр по умолчанию имеет значения равно, больше, меньше, не равно и находится в диапазоне. Я хотел бы сохранить поведение этих фильтров. Единственное, что я хотел бы изменить, - это формат ввода . Формат ввода даты по умолчанию - мм / дд / гг, и я хотел бы изменить, чтобы я мог вводить дату, подобную этой, 09 марта 2019 года. Есть ли простой способ изменить формат даты? Если нет, придется ли мне создавать собственный фильтр? И если у меня есть make custom, где я могу найти реализацию по умолчанию в качестве ссылки.

что бы я хотел изменить

1 Ответ

0 голосов
/ 13 марта 2019

вы не можете (в настоящее время) сделать это с текущим датчиком даты, потому что он внутренне использует <input type="date" /> (если используется хром, в противном случае просто текстовое поле), который всегда принимает языковой стандарт браузера, как описано в https://stackoverflow.com/a/9519493/885338

также описано в https://github.com/ag-grid/ag-grid/issues/1029 (также есть пример vue.js)

, поэтому вам нужно будет либо

  • следовать приведенным здесь шагам https://github.com/ag-grid/ag-grid/issues/2233
    , который модифицирует прототип DateFilter и является довольно хакерским решением, потому что он будет перезаписывать каждый DateFilter и изменяет (через прототип) код ag-grid.В наших случаях это работало, но не в вашем.
  • создайте пользовательский фильтр и используйте фильтр по умолчанию https://github.com/ag-grid/ag-grid/blob/master/packages/ag-grid-community/src/ts/filter/dateFilter.ts в качестве ссылки.

, если вы создаетеВ пользовательском фильтре вы можете указать дополнительные параметры, такие как желаемый формат даты, с помощью FilterParams

Метод init (params) принимает объект params с элементами, перечисленными ниже.Если пользователь предоставляет параметры с помощью атрибута colDef.filterParams, они будут дополнительно добавлены к объекту параметров, переопределяя элементы с тем же именем, если существует конфликт имен.

взято из: https://www.ag -grid.com / javascript-grid-filter-component / # ifilter-params

, с помощью которого вы можете написать фильтр даты, который может работать с различными форматами даты (например, с использованием момента.js), предоставив формат через colDef.filterParams

Ag-Grid имеет несколько хороших примеров для дат -> https://www.ag -grid.com / javascript-grid-date-component /

также см. https://github.com/ag-grid/ag-grid/issues/1029#issuecomment-393546876 для этой точной, все еще нерешенной проблемы и пример для vue.js, который вы можете использовать в качестве отправной точки для вашего фильтра на основе реакции

...