KnockoutJS更新行和場

Question

我卡在瞭如何使用knockoutJS

<div id="timeEntryList" data-bind="foreach: timeEntries"> 
     <table > 
      <tr> 
       ... 

       <td> //there are more of this, not included here 
<input type="number" 
    data-bind="value: Days[6].Hours, 
       event: { change: $root.setDirty }" /> 

       </td> 
       <td> //this part needs to be updated when the above input is changed 
        <span data-bind="text: $root.sumRow($data)"> 
        </span> 
       </td> 

最後一個TD有包含顯示報告對當前項目小時之span元素更新在foreach模板行總和在foreach。 它在加載數據時正確顯示，但在編輯元素時保持陳舊狀態。 如何在更改輸入框的值時更新此元素？

這裏是一個非常簡化版本我的視圖模型：

var TimeReportModel = function (init) { 
    this.timeEntries = ko.observableArray(init.TimeEntries); 

    //... helper functions 
}; 

TimeEntries是代表每週一小時的報道對象。 所以它包含一個天數組，每天有一個小時屬性。

Answer 1

根據您綁定的內容，看起來您綁定了常規函數的結果。如果您想在更改時看到更新的值，則需要綁定到observable。使總和在您的視圖模型中計算出可觀察值並綁定到它。

我不知道你所添加的您的視圖模型看起來還是什麼了，但它會是這個樣子：

// calculate the sum of the hours for each of the days 
self.totalDays = ko.computed(function() { 
    var sum = 0; 
    ko.utils.arrayForEach(self.days(), function (day) { 
     sum += Number(day.hours()); 
    }); 
    return sum; 
}); 

這裏有一個fiddle證明。