Knockout Js计算出不在模型中工作

时间:2015-07-22 10:28:50

标签: javascript jquery html knockout.js

我正在尝试修改以下knockout js模型绑定以符合我的要求:http://jsfiddle.net/zrBuL/291/。修改如下:

HTML:

<label>Male
   <input type="radio" name="IsMale" value="a" data-bind="checked:IsMale"/>
</label> 
<label>Female
   <input type="radio" name="IsMale" value="b" data-bind="checked:IsMale"/>
</label>
<div data-bind="text: ABC()"/>

使用Javascript:

var vm = {
    IsMale: ko.observable(false),
    ABC:ko.purelyComputed({
    read: function(){
            return this.IsMale();
        }
    },this)  
};
ko.applyBindings(vm);

对于框架,我赞成knockout.js 3.0.0。

问题是它没有为div的文本属性绑定到ABC()上面的div显示任何内容。

提示:如果我在读取功能中替换以下行:

return this.IsMale();

使用以下行:

return "Hi";

然后它就像一个魅力。

在调用属性IsMale时是否有任何遗漏?

2 个答案:

答案 0 :(得分:1)

我认为问题在于两件事:

  1. 没有purelyComputed,它是pureComputed

  2. 同样在Knockout 3.2.0中引入pureComputed,因此您需要升级到该版本才能使用它。

  3. Pure computed observables

答案 1 :(得分:1)

purelyComputed更改为pureComputed并升级到至少Knockout 3.2.0后,您会遇到另一个问题。 对象定义中的this是全局window对象。

为了获得vm而不是window的引用,您需要切换到function构造函数:

function MyVM() {
    this.IsMale = ko.observable(false);
    this.ABC = ko.pureComputed({
    read: function(){
            return this.IsMale();
        }
    },this);
};
ko.applyBindings(new MyVM());

然后it will work

另一种定义方法是:

var vm = {
    IsMale: ko.observable(false)
};

vm.ABC = ko.pureComputed({
    read: function(){
        return this.IsMale();
    }
}, vm);