0

我是 Knockout.js 的新手，我在 UI 中有 3 个字段。产品价值。数量总计

计算出的 observable 一切正常，并且可以保存数据。出于某些业务原因，总数将在后端更改。

在检索数据时，我需要将数据库中的总数显示为初始值，但是当用户更改产品和值时，应该使用原始计算函数。

我尝试了 bindingHandlers 但无法正确处理..

帮助将是非常可观的。

var TsFoundationDeviceModel = function(product,qty,total) {
    var self = this;
    self.product = ko.observable(product);
    self.quantity= ko.observable(qty);
    self.computedExample = ko.computed(function() {
        return self.product() * self.quantity() ;
    });
}

<input name="product" data-bind="value:product">
<input name="value" data-bind="value:value">
<input name="total" data-bind="value:computedExample"/>
4

3 回答 3

3

您可以做到这一点的唯一方法是跟踪初始化程序。因此，第一次调用视图模型时，将初始化设置为 true 并检查总数是否未定义。如果是，则返回总计，重置初始化。从那里开始，它将始终根据其他两个字段更新计算值。

这是相同的小提琴（顺便说一下，您的绑定中有错误，没有名称为“值”的属性，我认为它是数量

http://jsfiddle.net/sujesharukil/YTDZ9/

var TsFoundationDeviceModel = function(product,qty,total) {
    var 
    self = this;
    self.initialize = ko.observable(true);
    self.product = ko.observable(product);
    self.quantity= ko.observable(qty);
    self.computedExample = ko.computed(function() {
        var value = self.product() * self.quantity();
        if(self.initialize())
        {
            self.initialize(false);
            if(total != undefined && total != null)
                return total;
        }
        return value ;
    });
}


ko.applyBindings(new TsFoundationDeviceModel(1, 1, 3));

本质上，您将只返回一次总计，这是您第一次创建视图模型的实例。

希望这可以帮助！

-苏杰

于 2013-03-18T13:47:50.220 回答
0

据我所知，您存储了 3 个输入，您可以从数据库中获得它的值。

当用户单击某个保存按钮时，应将数据发送到服务器以更新或插入 DB，并且当加载表单时，应使用 DB 中的用户数据填充输入。

因此，您应该为此使用KnockoutJS 映射插件。

使用该插件，您只需要对您的服务器进行 ajax 调用以获取数据并将其转换为然后在您的 html 上ViewModel使用它。ViewModel

通过使用相同的插件，您可以将其转换ViewModel为 JSON 格式并将其发送回您的服务器以将其保存在数据库中。

于 2013-03-14T23:50:11.313 回答
0

如果我正确理解您想要什么，您可以让 Computed 本身返回初始值，除非可观察值发生变化。

self.product = ko.observable(product);
self.quantity= ko.observable(qty);
self.orig_product = ko.observable(product);
self.orig_quantity= ko.observable(qty);

self.computedExample = ko.computed(function() {
    if (self.product() !== self.orig_product
        || self.quantity() !== self.orig_quantity()) {
        return self.product() * self.quantity() ;
    } else {
        // return the initial value
    }
});
于 2013-03-15T12:39:13.973 回答