Question

我有一组字段或每行看起来像 {inBing:true, inOSM:true, inGoogle:false}。根据这些，我想将这些值表示为字符串，例如'B O'，意味着启用了Bing和OSM，而Google则没有。

所以我需要浏览这些字段并构建一个输出字符串。

问题是我在哪里可以在UI grid中调用此函数？

Answer 1

我会为此使用过滤器。

操纵您的数据：

{ field1: value1, field2: value2, searchFlags: { inBing: true, inOSM: false, inGoogle: true } }
{ field1: value2, field2: value4, searchFlags: { inBing: false, inOSM: true, inGoogle: false } }
...

你的columnDefs就像：

columnDefs: [
  { name: 'field1' },
  { name: 'field2' }, 
  { name: 'searchFlags', cellFilter: 'mapFlags' }
];

最后，定义过滤器：

.filter('mapFlags', function( input ) {
  str = '';
  if (v.inBing) str += 'B ';
  if (v.inOSM) str += 'O ';
  if (v.inGoogle) str += 'G';
  return str;
});

http://ui-grid.info/docs/#/tutorial/201_editable

中有一个过滤器示例

Answer 2

可以使用这样的自定义单元格模板：

columnDefs: [
      { name: 'name' },
      ...
      { name: 'whichSearchEngines', field: 'some_field', cellTemplate: '<div class="ui-grid-cell-contents" >{{grid.appScope.searchEngineFormatter(row.some_field)}}</div>' }
    ]

$scope.searchEngineFormatter = function (v) {
   str = '';
   if (v.inBing) str += 'B ';
   if (v.inOSM) str += 'O ';
   if (v.inGoogle) str += 'G';
   return str;
};

如何使用UI Grid自定义字段输出

2 个答案: