Kendo UI Grid列headerTemplate函数无法访问列定义

Question

我正在尝试使用Kendo UI Grid的columns.headerTemplate功能来自定义列标题.您可以使用此功能,如下所示,并由我创建的此示例演示.通常在使用Kendo UI模板时,窗口小部件会将实体传递给模板函数,因此您可以使用各种属性来自定义要呈现的html.

调试Kendo UI网格代码我可以看到,在_headerCellText方法中,即使列对象在范围内,对模板函数的调用也会传入一个空对象而不是列.

text = kendo.template(template, settings)({});

在为每个列使用自定义列标题模板之前是否还有其他方法可以采用 - 或者更糟糕的是jQuery操作窗口小部件呈现DOM？

是否有充分理由偏离此用例框架中的通用模板模式？

// Example kendoGrid use of column.headerTemplate
var templateFunction = function(shouldBeColumn) {
    // shouldBeColumn is an empty object rather than the column object
    return "Useless object:" + kendo.stringify(shouldBeColumn);
  };

$("#grid").kendoGrid({
    dataSource: {
        data: products,
        pageSize: 20
    },
    height: 550,
    scrollable: true,
    columns: [
      { field: "ProductName", title: "Product Name" },
      { field: "UnitPrice", title: "Unit Price", headerTemplate: plainTemplate },
      { field: "UnitsInStock", title: "Units In Stock", headerTemplate: templateFunction }
    ]
});

Answer 1

RE：“在为每列使用自定义列标题模板或更糟的情况之前，我可以采取另一种方法 - 渲染 DOM 的小部件的 jQuery 操作吗？”

调用返回函数的包装函数，因此：

function createHeaderTemplate(columnName) {
    return function() { 
        return "Custom: " + columnName; 
    };
}

...

columns: [
    { field: 'field', headerTemplate: createHeaderTemplate('My Field') },
    { field: 'field2', headerTemplate: createHeaderTemplate('My 2nd Field') }
]