Question

我需要使用自定义列过滤器来处理JS对象的帮助。

我有一个slickgrid表，其中一列中的值是JS对象：

[
  { id: "1234", text: "Batman"},
  { id: "2345", text: "Robin"}
]

我使用自定义格式化程序将对象粉碎成字符串：

// convert [{id:string, text:string}...] to string
const optionFormatter: Formatter = (row, cell, value, columnDef, dataContext: any) =>
  value ? value.map(o => o.text).join(', ') : '';

在slickgrid中显示为

Batman, Robin

我的slickgrid选项使用gridmenu并启用列过滤：

 this.gridOptions = {
  enableGridMenu: true,
  enableFiltering: true,
  enableAutoResize: true,
  enableColumnReorder: true
};

我的columnDef启用了对此列的过滤：

{ 
  id: 'owners', 
  name: 'Owners', 
  field: 'owners', 
  sortable: false, 
  formatter: optionFormatter, 
  filterable: true
}

如果单元格中的值是字符串，则一切正常，但如果单元格是对象，则过滤器不起作用。我假设过滤器正在搜索预先格式化的值。

有没有办法为列提供自定义过滤器函数，该函数知道如何在JS对象中搜索查询字符串？例如，如果我只能搜索JSON.stringify（value），那就足够了。

或者，this answer描述了如何使用格式化程序将格式化文本存储为dataContext中的不同字符串属性。如果我这样做，我如何指定要过滤的属性，因为它与列字段不同？

Answer 1

我找到了解决方法。

预处理我的数据，在所有对象值上调用JSON.stringify：

flattenFeature(f: Feature): any{
  var res = {};
  for (var prop in f) {
    res[prop] = (typeof f[prop] === 'object') ? JSON.stringify(f[prop]) : f[prop];
  }
  return res;
}

然后在我的格式化程序中，我在格式化之前解析json：

// convert [{id:string, text:string}...] to string
const optionFormatter: Formatter = (row, cell, value, columnDef, dataContext) =>
  value ? JSON.parse(value).map(o => o.text).join(', ') : '';

这允许标准字符串过滤器搜索stringify'd JSON

格式化列上的自定义列过滤器

1 个答案: