在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; 
};