0

コード

function Product(name) {
  this.name = ko.observable(name);
}

function ProductViewModel() {
  var self = this;
  self.products = ko.observableArray();
  $.getJSON("/admin/test", function(allData) {
    var mappedProducts = $.map(allData, function(item) { return new Product(item.name) });
    self.products(mappedProducts);
    console.log(self.products);
  });    
}

ko.applyBindings(new ProductViewModel());

問題:allDataとmappedProductsが適切に設定されている間 (名前と他のフィールドを持つ製品の配列のみ)、行console.log(self.products);は空の配列を出力しています。

私は本当に混乱しています。最初は KO を使用していますが、これはチュートリアルとまったく同じコードのようです...タスクの代わりに製品を使用しているだけです。私は何かばかげたことを見逃していると確信しています。

4

2 に答える 2

2

オブザーバブル自体ではなく、オブザーバブル内のものをログに記録する必要があります。

console.log(self.products());

コードを含むデモについては、このフィドルを参照してください。

質問の状況では、何がログに記録されるかはブラウザによって異なります。確かに、Chromeは多少混乱します。

[]

空の配列のようです。Internet Explorer 10はより理に適っており、以下を出力します。

function c(){if(0<arguments.length)return c.equalityComparer&&c.equalityComparer(d,arguments[0])||(c.K(),d=arguments[0],c.J()),this;a.q.bb(c);return d}

つまり、実際にself.productsは関数 (観測可能) であるという事実です。Firefoxは中間にあり、次のように出力します。

c()

IE10ほど役に立ちませんが、Chromeほど混乱しません。

于 2013-10-16T22:05:24.410 に答える
1

これはオブザーバブルを設定するためのものです:

self.products(mappedProducts)

そして、これは観測値または計算値を取得するためのものです

var mappedProducts = self.products();

括弧に注意してください。

お役に立てば幸いです。

于 2013-10-16T21:57:56.730 に答える