javascript - 如何避免在页面加载时调用 knockout 绑定(bind)？

Question

我有一个 knockout 的 View 模型，它有一个名为 updatePrices 的计算函数。永远不应调用此方法，除非用户在我的表格中切换复选框。

该表由 foreach 数据绑定(bind)生成。

我目前的体验是 updatePrices 方法在页面加载时为表格中的每一行 调用，然后当用户切换复选框时。我期望的行为是它只在我切换复选框时调用 updatePrices，而不是在页面加载时调用。

所以我基本上想避免在页面加载时调用这些方法。我该怎么做？

我的 html 标记:

<tbody data-bind="foreach: invoices">
    <tr>
        <td>
            <input type="checkbox" data-bind="checked: print, click:updatePrices()" />
        </td>
        <td data-bind="text: invoiceDate"></td>
        <td data-bind="text: customerName"></td>
        <td data-bind="text: amount"></td>
        <td>
            <a data-bind="attr: { href: pdfLink }">Download</a>
        </td>
        <td data-bind="text: status"></td>
    </tr>
</tbody>

我的 knockout 函数:

self.updatePrices = ko.computed(function () {
    $.ajax({
        url: '/SingleLetter/GetPriceFromUrl',
        type: 'POST',
        data: {
            pdfUrl: self.pdfLink,
        },
        dataType: 'json',
        success: function (data) {
            self.jsonPrice(data.price);

        },
        error: function (file, responseText) {
            console.log('Price error');

        }
    });

});

Answer 1

首先，您不需要使 updatePrices 可计算，因为它不返回任何值，也不依赖于任何其他 View 模型变量。

其次，您的点击数据绑定(bind)不正确，因为您立即调用了该函数。您的数据绑定(bind)应如下所示:

 <input type="checkbox" data-bind="checked: print, click:updatePrices" />