数据更改时 kogrid 不更新列

Question

我有这样简单的数据：

var dataFromAjax = [
     {Id : 1, Name : "Yoza", Status : 1},
     {Id : 2, Name : "Dhika", Status : 1}
];

和来自 ajax 的下一个数据将具有不同的架构。像这样：

var nextData = [
    {Id : 1, Name : 'Yoza', Job : 'Programmer', Phone : '08788'},
    {Id : 1, Name : 'Dhika', Job : 'Designer', Phone : '99987922'}
]

在我的代码中：

self.Data = ko.observableArray();
self.Data(nextData);
self.Data.valueHasMutated();

问题是列没有更新。列仍然与第一个模式相同，即 ID、名称和状态。作业和 Phone 未呈现。如何呈现不同的模式？

Answer 1

您需要将 observableArray columnDefs 传递给您的 koGrid 绑定，以便它进行更改。查看他们的文档 here.

喜欢：

HTML绑定：

<div data-bind="koGrid: {data: Data, columnDefs: columns}"></div>

视图模型（仅部分）：

self.columns = ko.computed(function(){
    var cols = Object.keys(self.Data()[0]);
    return cols.map(function(col){
        return {
            field: col
        };
    });
});

您可以定义创建 columns 的方式，只要它 returns 一个包含 field 对象的对象数组即可。（有关更多信息，请参阅上面的文档）

我创建了一个缩小的 fiddle here 以根据您的数据提供一些示例。数据会在1秒后发生变化（这只是为了测试）。

数据更改时 kogrid 不更新列

kogrid not updating column when data changed

knockout.js

kogrid