Question

我正在使用一个可观察的“部件”数组，其中包含一个可观察到的“Vol”。我目前有每个部分的音量以及显示的总量。应用程序启动时，正确添加总金额。但是，当我更改部件的音量时，总量不会重新计算。

HTML：

<ul>
    <li data-bind="foreach:  Parts">
        <input data-bind="value: Vol" />
<br/>
    </li>
</ul>

<br/>
<br/>
<span data-bind="text: fullVol "></span>

使用Javascript：

    function Part (data) {

       var self = this;
        self.Vol= ko.observable(data.Vol);

    }


    function AppViewModel() {
       var self = this;


        self.Parts = ko.observableArray([new Part({"Vol": 1}), new Part({"Vol":2}), new Part({"Vol":3})]);
        self.fullVol = ko.computed(function() {
            var total = 0;
           $.each(self.Parts(), function() { total += (this.Vol() ) })
            return total;
        });
    }


ko.applyBindings(new AppViewModel());

这是我的JsFiddle：http://jsfiddle.net/jwinstonaspen/Zmkew/6/

Answer 1

当您使用value: Vol绑定时，无法将输入转换为整数，只是将用户输入的数据存储为字符串。

所以你需要在计算总数之前将它解析为整数：

$.each(self.Parts(), function() { total += (parseInt(this.Vol()) ) })

固定的fiddle。

现在因为您正在进行解析，所以当用户输入非数字输入时，您不应忘记处理。

但是，您可以轻松编写一个custom binding handler来抽象解析。

或者您可以使用ko.extenders。该文档还有一个示例here。

计算出的Knockoutjs在更新后不会重新计算

1 个答案: