がKnockoutJS

Question

今、私は次のようなJSON文書を持っているとのJavascript＆jQueryのでJSONドキュメントの配列を通って行く：誰かが20株を望んでいる場合

[ 
    { 
     "price":"1.0", 
     "shares":13 
    }, 
    { 
     "price":"2.0", 
     "shares":5 
    }, 
    { 
     "price":"3.0", 
     "shares":24 
    } 
] 

することは、私は20株式の低価格を可能に返すようにしたいです。この場合、そのの：$ 1（$ 13）で

13株

5株$ 2（$ 10）とで

2株

総コストは$ 3（$ 6）で$ 29

これを行う特定のノックアウトコードは、以前に定義された（そして動作している）this.wantedShares（）バインディングから20のシェアを取得します。

コード：

this.totalCost = ko.computed(function(){     
      var wantedShares = this.wantedShares(); 
      var shareCounter = 0.00; 
      var counter = 0; 
      var totalPrice = 0.00; 

      $.getJSON("sell.json", function(json){ 
       $.each(json, function() { 
        if(shareCounter <= wantedShares){ 
        shareCounter = shareCounter + json[counter].shares; 
        totalPrice = totalPrice + (json[counter].price * json[counter].shares); 
        counter++; 
        } 
       }); 
      }); 
      return totalPrice; 
    }, this); 

このコードは、そのまったくtotalPriceを更新していない、何が起こっているものは何でも、動作しません - それは0で任意のアイデアのまま？

Answer 1

AJAXは、Ajaxが

Answer 2

あなたの$ .getJSON機能が非同期で完了する前に、あなたのリターンが発火する非同期であり、それが戻ったとき、それはあなたのコールバックを実行しますが、その間にあなたはすでに0のtotalPriceを返しました。私はwantedSharesの購読に切り替え、totalPriceにコールバックで設定した観測値を設定することをお勧めします。

Answer 3

$ .getJSONは非同期要求です。 「AJAX」の「A」=非同期です。

ノックアウトが計算値を評価するとき、非同期操作が完了するのを待つことはありません。したがって、常に0が返されます。

ボトムライン：計算された値内でAJAXリクエストを実行しないでください。私はそれが動作を示しthis JSFiddleを作成しました

// Fetch all the shares asynchronously. 
var allShares = ko.observableArray(); 
$.getJSON("sell.json", function(shares) { allShares(shares); }); 

// The totalCost observable is dependent on the allShares. 
// When allShares changes asynchronously, totalCost will get re-evaluated. 
var totalCost = ko.computed(function() {    
    var shareCounter = 0.00; 
    var totalPrice = 0.00; 

    allShares().each(function(share) { 
     if(shareCounter <= wantedShares().length) { 
      shareCounter = shareCounter + share.shares; 
      totalPrice = totalPrice + (share.price * share.shares); 
     } 
    }); 
}); 

：

代わりに、このような何かを行います。