在knockout JS（Magento 2）中使用可觀察數組

Question

我使用Knockout JS來執行一些基本的價格計算，這些計算需要在我的視圖中顯示。

我傳入一個key => value數組作爲配置，然後我的JavaScript模型對數組進行一些計算並更新它。

所以我可以更新前端，我使用ko.observableArray()。

我的模板文件看起來像這樣：

<span>Price $<span data-bind="text: priceCalculator.prices()['<?php echo $block->getSomeKey ?>']"></span></span> 

而且我PriceCalculator模式是這樣的：

this.priceMap = priceMap; // from config 
this.prices = ko.observableArray(); 
this.setObservablePrices(); 


this.setObservablePrices = function() { 
    var self = this; 
    $.each(this.priceMap, function(key, value) { 
     self.prices()[key] = self.doSomePriceCalc(value); 
    }); 

    return this; 
}; 

的問題是，我的模板只顯示變量集的第一個實例在我陣列。 IE瀏覽器，如果我再次運行this.setObservablePrices();並且價格更新它不會反映在我的模板文件中。我注意到Knockout JS說要使用self.prices（）。push（value）但是我不知道我是否可以在不丟失數組鍵的情況下做到這一點？

我嘗試以下，但它創建我不想以3D陣列：

var price = {}; 
price[key] = value; 
this.prices().push(price); 

Answer 1

好了，所以我想通了，我不得不接近它略有不同。而不是使用可觀察到的陣列，我創建在一個陣列可觀察到的元素：

var self = this; 
$.each(this.prices, function(key, value) { 
    self.prices[key] = ko.observable(self.doSomePriceCalc(value)); 
}); 


this.setObservablePrices = function() { 
var self = this; 

    $.each(this.prices, function(key, value) { 
     self.prices[key](self.doSomePriceCalc(value)); 
    }); 

return this; 
};