如何在Slick网格自定义单元格格式器中应用自定义Fliter格式化程序

时间:2017-03-13 10:14:42

标签: angularjs ecmascript-6 slickgrid

如何在光滑网格自定义单元格格式器中应用自定义角度滤镜格式化程序

假设我有一个角度客户过滤器格式化程序,可以将日期从一种格式转换为另一种格式。

var dateFilter = this.$filter('myDateFilterFormatter')('2006-04-07'); 

它以4/7/06返回。

如何在光滑网格自定义单元格格式器中使用myDateFilterFormatter

我试过这种方式

this.dateFommatter = function(row, cell, value, columnDef, dataContext){
            return "<p>"+ value | myDateFilterFormatter +"</p>";
        };

并尝试

this.dateFommatter = function(row, cell, value, columnDef, dataContext){
                return "<p>"+ this.$filter('myDateFilterFormatter')(value) +"</p>";
            };

两种方式都以错误结束。我无法在光滑网格行格式化程序中应用自定义过滤器。您能否建议,我如何在光滑网格中使用自定义过滤器。

1 个答案:

答案 0 :(得分:1)

this函数内的

dateFormatter指的是函数本身。

通常使用像

这样的东西
var self = this;

... code ...

this.dateFommatter = function(row, cell, value, columnDef, dataContext){
    return "<p>"+ self.$filter('myDateFilterFormatter')(value) +"</p>";
};

要回答第二个查询,调用格式化程序的代码例如是

function updateCell(row, cell) {
  var cellNode = getCellNode(row, cell);
  if (!cellNode) {
    return;
  }

  var m = columns[cell], d = getDataItem(row);
  if (currentEditor && activeRow === row && activeCell === cell) {
    currentEditor.loadValue(d);
  } else {
    cellNode.innerHTML = d ? getFormatter(row, m)(row, cell, getDataItemValueForColumn(d, m), m, d) : "";
    invalidatePostProcessingResults(row);
  }
}

我认为您要求访问cellNode。 你可以添加

var cellNode = grid.getCellNode(row, cell);
如果您愿意,请

到您的格式化程序。

从长远来看,如果您发现访问单元节点很有用,您可以修改formatter函数以及对它的所有调用,将cellNode添加到结尾参数列表。但是,这将是对slickgrid代码的修改。

编辑:实际上我只测试了它并且它不起作用,因为在创建单元格时,格式化程序在创建单元格之前被调用。我在最新版本的SlickGrid中修改了格式化程序,因此您可以选择返回对象{ text: 'displayText', removeClasses: 'class1 class2', addClasses: 'class1' }而不是返回字符串,并且在应用格式化程序时,类将被删除并添加到单元格中。删除一系列类允许在应用正确的新类之前清除先前的格式化类。