ko.computed on ko.observableArray

时间:2013-03-07 01:55:43

标签: javascript knockout.js

我正在尝试使用计算器来计算某些产品的总数。

function productViewModel(){

    self = this;
    function productModel(data)
    {
        var self=this;
        self.id=ko.observable(data.id);
        self.codigo=ko.observable(data.codigo);
        self.recurso=ko.observable(data.recurso);
        self.unidad=ko.observable(data.unidad);
        self.precio_unitario=ko.observable(0);
        self.cantidad=ko.observable(0);
        self.total=ko.computed(function()
            {
                return self.precio_unitario()*self.cantidad(); 
            },productModel); 
    }

    self.products = ko.observableArray([]);

    self.addProduct = function(product)
    {
        self.products.push(new productModel(product));
    };
    self.removeProduct = function()
    {
        self.products.remove(this);
    };

}

orden = new productViewModel()
ko.applyBindings(orden);

但是当precio_unitariocantidad发生变化时。 total未更新。

2 个答案:

答案 0 :(得分:3)

function productModel(data)
{
    var self=this;
    ...
    self.total=ko.computed(function()
        {
            return self.precio_unitario()*self.cantidad(); 
        },this); 
}

您应该将ko.computed绑定到this而不是该函数。您希望它绑定到创建的对象,而不是绑定到构造函数,而构造函数上没有这些属性。由于你正在使用self,所以默认情况下会实际使用它,如果你愿意,你可以完全省略第二个参数。

在构造函数中,thisself将引用使用new运算符时创建的对象。因此,将在该对象上创建所有属性。

答案 1 :(得分:2)

self = this;应为var self = this;;否则你会覆盖全球self。同时取出,productModel计算出来的;没必要。

重要部分:

function productViewModel() {
    var self = this;

    function productModel(data) {
        var self = this;
        ...
        self.total = ko.computed(function() {
            return self.precio_unitario()*self.cantidad(); 
        });
    }
    ...
}

此外,确保始终使用正确的格式写入可观察对象也很重要。它应该是self.catidad(newValue);而不是self.catidad = newValue;