如何使用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); 
    }); 
}