0

对于我的一个 Kendo UI 网格，我为特定列指定了 headerTemplate。但是，模板中似乎没有任何绑定上下文。我绑添加

<span data-bind='text: ko.toJSON($data)'></span>

到模板，但没有呈现任何内容。

网格在视图模型中使用

self.gridConfig = {
    data: self.Transactions,
    height: 350,
    pageable: {
        pageSize: 5
    },
    useKOTemplates: true,
    rowTemplate: "exportRowTemplate",
    columns: [{
        title: "Policy Number",
        width: 120
    }, {
        title: "Insured Name",
        width: 250
    }, {
        title: "Effective Date",
        width: 120,
        format: "{0:MM/dd/yyyy}"
    }, {
        title: "Transaction Type",
        width: 150
    }, {
        title: "Premium",
        format: "{0:c2}",
        width: 120
    }, {
        headerTemplate: "<strong>Select</strong><span style='margin-left: 10px'><input type='checkbox' data-bind='checked: checkAllValue' /></span><span data-bind='text: ko.toJSON($data)'></span>"
    }]
};

如何绑定 headerTemplate 中的控件？

4

1 回答 1

1

您可以通过从表的头部删除敲除绑定然后在网格的数据绑定事件上重新绑定它来做到这一点。

这是一个显示示例的 JSFiddle：http: //jsfiddle.net/ek1qkxth/

您需要做的就是将其添加到您的 gridConfig 设置中：

dataBound: function (e) {
    var header = e.sender.thead[0];
    ko.cleanNode(header);
    ko.applyBindings(self, header)
}

它在您的 gridConfig 中：

self.gridConfig = {
    data: self.Transactions,
    height: 350,
    pageable: {
        pageSize: 5
    },
    useKOTemplates: true,
    rowTemplate: "exportRowTemplate",
    dataBound: function (e) {
        var header = e.sender.thead[0];
        ko.cleanNode(header);
        ko.applyBindings(self, header)
    },
    columns: [{
        title: "Policy Number",
        width: 120
    }, {
        title: "Insured Name",
        width: 250
    }, {
        title: "Effective Date",
        width: 120,
        format: "{0:MM/dd/yyyy}"
    }, {
        title: "Transaction Type",
        width: 150
    }, {
        title: "Premium",
        format: "{0:c2}",
        width: 120
    }, {
        headerTemplate: "<strong>Select</strong><span style='margin-left: 10px'><input type='checkbox' data-bind='checked: checkAllValue' /></span><span data-bind='text: ko.toJSON($data)'></span>"
    }]
};
于 2014-11-14T22:56:12.087 回答