3

私は Knockout にまったく (非常に!) 慣れていないので、次の問題に関して正しい方向に向けていただければ幸いです。

jsFiddleで探している最終結果の例があります

最終的に、価格にバインドされたテーブル行に多数のチェックボックスを配置したいと考えています (動的にロードされます)。行の最後のセルには、選択された (チェックボックスがオンになっている) すべての価格の平均値が保持されます。

これは、ViewModel で得た限りです。

//--Page ViewModel

//--Set the structure for the basic price object
function Price(quote) {
  this.quote = ko.observable(quote);
}

//--Sets the structure for the contract month object
//--This includes the month, and array of Price and an average
function ContractMonthPrices(month, prices) {
  this.month = month;
  this.prices = $.map(prices, function(quote) { return new Price(quote); });

  this.average = ko.computed(function() {
      var total = 0;
      for(var i = 0; i < this.prices.length; i++)
        total += this.prices[i].quote();
      return total;
  }, this);
}

おそらく役に立たないことはわかっていますが、どんな助けでも大歓迎です！

ありがとう！

4

1 に答える 1

3

ソースデータが次のようになっていると仮定して、フィドルを少し変更しました。

var allPrices = [
    { month: 'January', prices: [ 3, 4, 4, 4 ] },
    { month: 'February', prices: [ 7, 8, 2, 3 ] },
    { month: 'March', prices: [ 7, 8, 2, 1 ] }
];

http://jsfiddle.net/2Ccvk/5/

完全なデータバインディングでマークアップを完全に書き直しました。

計算された観測可能な作業を取得するために、すべての価格にプロップをaverage追加しました:selected

function Price(quote) {
    this.quote = ko.observable(quote);
    this.selected = ko.observable(true); // bound to checkbox in markup
}

また、コード全体で多数の変更と修正が行われました。

PS KOには共通の配列操作を実行するための独自のメソッドがあるため、変更$.mapしました。ko.utils.map必要に応じて、引き続き jQuery メソッドを安全に使用できます。

于 2013-05-16T17:23:34.223 に答える