Question

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

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

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

我尝试过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"/>

Answer 1

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

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

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

在essensce中，您将首次返回总计，这是您第一次创建视图模型的实例。

希望这有帮助！

-Suj

Answer 2

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

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

所以你应该为此目的使用KnockoutJS mapping plugins。

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

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

Answer 3

如果我理解你想要什么，你可以让Computed本身返回初始值，除非observables改变。

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

设置计算的Observable Knockout.js的默认值

3 个答案: