如何在JSON中使用Knockoutjs的数据绑定函数

How to use a data binding function of Knockoutjs inside JSON?

本文关键字:Knockoutjs 数据绑定 函数 JSON      更新时间:2023-09-26

在下面的Knockoutjs代码中,名字和姓氏都有效。显示全名时出现问题。它没有得到"this.firstName"answers"this.lastName"的值。我该如何解决这个问题。

var AppViewModel = {
    firstName:ko.observable("Bert"), 
    lastName:ko.observable("Bertington"), 
    fullName:ko.pureComputed(function(){
        return this.firstName()+ " "+this.lastName();   
    }, this, {deferEvaluation : false})
};
<h1>Introduction</h1>
<p>First name: <strong data-bind="text:firstName">todo</strong></p>
<p>Last name: <strong data-bind="text:lastName">todo</strong></p>
<p>First name: <input data-bind="value:firstName" /></p>
<p>Last name: <input data-bind="value:lastName" /></p>
<p>Full name: <strong data-bind="text:fullName"></strong></p>

我做了一些轻微的改变,因为我习惯于使用敲除

var AppViewModel = function (data){
    this.firstName=ko.observable("Bert"), 
    this.lastName=ko.observable("Bertington"), 
    this.fullName=ko.computed(function(){
       return this.firstName() + this.lastName()
    }, this, {deferEvaluation : false})
}
appModel = new AppViewModel();
ko.applyBindings(appModel);

这是一把工作小提琴:

http://jsfiddle.net/su3sfdff/

如果您希望计算的是"实时"的

调整valueUpdate属性this:

<p>First name: <input data-bind="value:firstName,valueUpdate:['afterkeydown', 'input']" /></p>
<p>Last name: <input data-bind="value:lastName,valueUpdate:['afterkeydown', 'input']" /></p>

http://jsfiddle.net/su3sfdff/1/