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

在淘汰JS（Magento 2）中使用可观察数组

1 个答案: