如何使用JavaScript中的Knockout計算分組行的小計？

Question

我想計算所選行的分組行的子總數，我能夠計算，但通過循環所有元素，每次更改總計算。任何人都可以建議如何從分組行中增加或減去行值。如果我們有大量的行，並選擇所有正在花費更多的時間。這裏是我的示例代碼http://jsfiddle.net/Srinivasa/PAtSd/2/

Answer 1

您的方法看起來不錯。如果你有性能問題，你必須有大量的行，在這種情況下，你真的想重新考慮用戶界面。也就是說，你可以通過訂閱數量和選擇觀察到並根據一本書的舊值和新值來更改總計。下面的代碼說明了這個想法，但不是一個完整的解決方案。另外，標準的knockoutjs observable沒有lastValue屬性，所以你必須自己實現它（here是你如何去做的一個例子）。

function book(...){ 
    var self = this; 
    ... 
    self.qty.subscribe(function(newValue){ 
     if(self.selected()){ 
      //grandTotal is regular observable, not a computed one 
      var grandTotal = rootViewModel.grandTotal(); 
      grandTotal = grandTotal - self.qty.lastValue() + newValue; 
      rootViewModel(grandTotal); 
     }    
    } 
} 

學生級別的小計，你將需要通過學生的視圖模型作爲參數傳遞給預定的構造：

function book(student, name, qty){ 
    var self = this; 
    ... 
    self.qty.subscribe(function(newValue){ 
     if(self.selected()){ 
      //student.noOfBooks is regular observable, not a computed one 
      var noOfBooks = student.noOfBooks(); 
      noOfBooks = noOfBooks - self.qty.lastValue() + newValue; 
      student.noOfBooks(noOfBooks); 
     }    
    } 
} 

你可能會需要學生構造改變這樣的事情：

function student(name, books /*array of plain object, not view models*/){ 
    var self = this; 
    self.name = name; 
    self.noOfBooks = ko.observable() 
    self.books = ko.utils.arrayMap(books, function(b){ 
     return new book(self, b.name, b.qty); 
    }); 
}