somma di calcolo a eliminazione diretta

Question

Ricevo dati da un WCF e li lego a un tavolo. Sono stato aiutato in questo forum per aggiungere alcuni campi di calcolo e tutto funziona perfettamente. Mi piacerebbe aggiungere un totale al piè di pagina di questo tavolo. una versione semplice della mia pagina può essere vista allo http://jsfiddle.net/qeUHd/3/. Fondamentalmente mi piacerebbe imparare come aggiungere un campo al mio ViewModel che è il risultato della somma di un altro campo nel mio esempio "Amount". Qualsiasi aiuto sarebbe molto apprezzato. http://jsfiddle.net/qeUHd/3/

Answer 1

Nel tuo mazzo, stai mappando il tuo set di dati su self.model, quindi self.model è un observableArray. Dato che era il caso, avevo solo bisogno di mettere insieme un computed value per ottenere il totale.

http://jsfiddle.net/qeUHd/5/

self.total = ko.computed(function(){ 
    var total = 0; 
    for(var p = 0; p < self.model().length; ++p) 
    { 
     total += self.model()[p].Amount(); 
    } 
    return total; 
}); 

Poi basta assicurarsi di legarsi ad esso.

<td data-bind="text: total"> 

stai facendo le cose un po 'indietro, ma suppongo che sia a causa del modo in cui si sta ricevendo i dati, così ho affrontato con esso e si è trasferito.

Answer 2

Anche se in genere suggerisco e supporto la collocazione di questi tipi di campi calcolati nel modello di visualizzazione (in genere quello in cui appartengono), ci sono momenti in cui si lavora con dati in cui è difficile aggiungere proprietà calcolate aggiuntive. Un esempio potrebbe essere se si raggruppano i dati all'interno della vista. In tal caso, è ancora possibile visualizzare il totale, ma spostare il calcolo alla vista:

<td data-bind="text: $data.reduce(function(x,y) { return x + y.Amount(); }, 0)"></td>