javascript - knockout js 绑定(bind)未正确绑定(bind)网格标题

Question

我正在使用 Knockout.js 和 Kendo-UI。
我有这个网格模型:

var GridModel = function (options) {
        function GridItem(item) {
            return { Id: item.Id() || '', Description: item.Description() };
        }

        $.extend(this, {
            data: ko.observableArray(),
            gridOptions: {
                pageable: true,
                pageSize: 5,
                sortable: true,
                scrollable: false,
                selectable: true,
                columns: [
                        { field: 'Id', title: 'title1', width: '80px', groupable: false },
                        { field: 'Description', title: 'title2', width: '200px', groupable: false }
                ]
            }
        });

        this.addItem = function (item) {
            this.data.push(new GridItem(item));
        }
    };

这是我的标记:

<div id="GridDiv" data-bind="kendoGrid: data, gridOptions: gridOptions"></div>

这就是我应用绑定(bind)的方式:

ko.applyBindings(new GridModel(), $('#GridDiv').get(0));

由于某种原因，列的标题未绑定(bind)，我得到的是 Id 和 Description，而不是 title1 和 title2。此外，如果我将 this.data.push(new GridItem(item)); 替换为 this.data.push(item); 那么我得到的不是 2 列10 列(因为项目包含 10 个成员)。

为什么绑定(bind)不能正常工作？

更新:我添加了一个jsfiddle http://jsfiddle.net/mTqdE/14/但不知何故它不起作用......有什么想法吗？

Answer 1

他们有an example如何使用 Knockout 绑定(bind)正确传递附加选项:

Here's working example :

<div id="GridDiv" data-bind="kendoGrid: gridOptions"></div>
<button data-bind="click: addRandomItem">add</button>

并将数据作为网格选项传递。