KendoUI：将视图模型绑定到数据源更改

Question

我有一个可观察对象，它定义了绑定到网格的数据源的指针，以及一个应该返回我在数据源中声明的聚合值的自定义字段。

我想将第二个字段（“totAmount”）绑定到自定义HTML元素。

我不明白如何更新它的值：当我调用数据源的“read（）”方法时，不应该在界面上更新绑定值吗？它仅适用于“原始”模型字段吗？

=== JAVASCRIPT === 
var vm = kendo.observable({ 
    gridDatasource: new kendo.data.DataSource({ ... }), 

    totAmount: function() { 
     var ds = this.get("gridDatasource"); 
     var value = (ds.aggregates()) ? ds.aggregates().totAmount : 0; 
     return value; 
    } 
}); 

=== HTML === 
<span data-bind="text: totAmount"></span> 

Answer 1

我以前的答案并不完全正确：它绑定了网格更改时的模型更新（每行选择）。最好将它绑定到数据源的“更改”事件上：

=== JAVASCRIPT === 
var vm = kendo.observable({ 
    gridDatasource: new kendo.data.DataSource({ ... }), 
    totAmount: 0 
}); 

vm.gridDatasource.bind("change", function(e) { 
    vm.set("totAmount", this.aggregates().totAmount); 
}); 


=== HTML === 
<span data-bind="text: totAmount"></span> 

Answer 2

到目前为止，我也发现了类似我以前的帖子（bind HTML elements to grid selected row/dataItem）的解决方案，以绑定到数据源网格的“改变”事件设定值：

=== JAVASCRIPT === 
var vm = kendo.observable({ 
    gridDatasource: new kendo.data.DataSource({ ... }), 
    totAmount: 0 
}); 

$("#grid").kendoGrid({ 
    change: function(e) { 
     vm.set("totAmount", this.dataSource.aggregates().totAmount); 
    } 
}); 


=== HTML === 
<span data-bind="text: totAmount"></span>