javascript - 何时在 Knock.js 绑定(bind)中使用方法调用 "()"语法

Question

这是一个消磨 20 分钟的好方法。当使用 knockout.js 在 foreach 循环中进行这样的绑定(bind)时，一切正常。

    <tbody data-bind="foreach: LineItems">
<tr>
    <td>
        <input data-bind="value: Quantity" class="may-frm-grid-input may-frm-grid-input-txt-num" />
    </td>
    <td><input data-bind="value: UnitPriceExTax" class="may-frm-grid-input may-frm-grid-input-txt-num" /></td>
    <td data-bind="text: LineTotalExTax" class="may-frm-grid-val-lbl"></td>
    <td>
        <input data-bind="value: UnitPriceTaxRate" class="may-frm-grid-input may-frm-grid-input-txt-num" />
    </td>
    <td data-bind="text: LineTotalTaxAmt" class="may-frm-grid-val-lbl"></td>
    <td data-bind="text: LineTotalIncTax" class="may-frm-grid-val-lbl"></td>
</tr>
</tbody>

请注意，绑定(bind)仅使用方法名称而不是方法调用，即。 LineTotalExTax 不是 LineTotalExTax()

但在 foreach 之外，如下所示:

<tbody>
    <tr>
        <td class="may-frm-grid-lbl-right"></td>
        <td class="may-frm-grid-lbl-right"></td>
        <td class="may-frm-grid-lbl-right"></td>
        <td>
            <input data-bind="value: FreightExTax" class="may-frm-grid-input may-frm-grid-input-txt-num" />
        </td>
        <td>
            <input data-bind="value: FreightTaxRate" class="may-frm-grid-input may-frm-grid-input-txt-num" />
        </td>
        <td data-bind="text: FreightTaxAmt" class="may-frm-grid-val-lbl"></td>
        <td data-bind="text: FreightIncTax" class="may-frm-grid-val-lbl"></td>
    </tr>
</tbody>

这似乎会产生问题。因此，尽管在绑定(bind)到计算的可观察量时，值会受到绑定(bind)，如下所示:

function EoiViewModel() {
            var self = this;
            self.LineItems = ko.observableArray([]);
            self.QuoteID = ko.observableArray();
            self.CurrencyID = ko.observableArray();

            self.FreightExTax = ko.observable(0);
            self.FreightTaxRate = ko.observable(0);

            self.FreightTaxAmt = ko.computed(function () {
                return (self.FreightExTax() * (1 + (self.FreightTaxRate() / 100))) - self.FreightExTax();
            });
            self.FreightIncTax = ko.computed(function () {
                return  self.FreightExTax() + self.FreightTaxAmt();
            });
            self.TotalExTax = ko.observable(0);
            self.TotalTaxes = ko.observable(0);
            self.TotalIncTax = ko.observable(0);

        }

返回的值:

  <td data-bind="text: FreightIncTax" class="may-frm-grid-val-lbl"></td>

对于 10 的运费税和 1 的运费税率来说，这将是一个非常烦人的 100.11110000。也就是说，它使用“+”作为串联运算符而不是附加运算符。

所以我的问题是为什么？我如何“逃脱”在 foreach 中没有方法调用语法但在循环外的绑定(bind)中没有方法调用语法的情况？

更新:

我还应该添加 foreach 循环无法绑定(bind)是我在方法“()”语法中添加的，所以很明显它与范围有关，但是什么呢？

Answer 1

我认为这与 () 没有任何关系。在 Knockout 中，可以使用或不使用 () 来绑定(bind)到单个可观察值或计算值。这是因为 Knockout 基本上在绑定(bind)上运行 ko.unwrap() 来获取其值。

您在这里遇到了串联问题，因为虽然可观察量 FreightExTax 和 FreightTaxRate 最初分配的是数字，但它们变成了字符串，因为它们绑定(bind)到输入框。一旦这些值被修改，它们就变成了字符串。这行:

return self.FreightExTax() + self.FreightTaxAmt();

成为串联。 parseFloat() 修复了它......

return parseFloat(self.FreightExTax()) + self.FreightTaxAmt();

fiddle ... http://jsfiddle.net/VSZE4/