Knockout Mapping不起作用

时间:2012-09-12 09:15:14

标签: javascript knockout.js

我在使用Knockout Mapping时遇到了麻烦。

我有一个FormBuilderViewModel,包含一系列功能,包括加载和保存数据。第一行(在self = this之后)如下:

this.form = ko.mapping.fromJS({blueprint_identifier: undefined, name: undefined, description: undefined, pages : []})

我使用3个元变量和1个数组初始化'this.form'。

然后,我加载数据(也在FormBuilderViewModel中):

ko.mapping.fromJSON(allData, {}, self.form);

变量allData来自AJAX请求,包含以下内容: {"blueprint_identifier":1347437911,"name":"test","description":"test","pages":[]}

问题是:加载的JSON永远不会出现在我的页面上。加载数据后console.log(this.form)的输出为空。这是整个脚本(除了函数等):

var FormBuilderViewModel = function(data){
    var self = this;

    this.form = ko.mapping.fromJS({
                   blueprint_identifier: undefined, 
                   name: undefined, 
                   description: undefined, 
                   pages : []
                })

    $.getJSON("x", function(allData) {
        if(){
            console.log("I'm here");
            ko.mapping.fromJSON(allData, {}, self.form);
        }else{
            // not relevant
        }
    });
    console.log(self.form); 
};

输出是'我在这里'(所以我们到达加载点),然后是空的'form'对象。

我在这里缺少什么?

2 个答案:

答案 0 :(得分:0)

$.getJSON函数有效async所以当你调用console.log(self.form)映射没有完成时。 要在控制台输出中查看对象,请将日志操作移动到成功函数中:

$.getJSON("x", function(allData) {
    if(){
        console.log("I'm here");
        ko.mapping.fromJSON(allData, {}, self.form);
        console.log(self.form);
    }else{
        // not relevant
    }
});

尝试使用ko.mapping.fromJS代替ko.mapping.fromJSON,因为allData不是预期的fromJSON字符串:

$.getJSON("x", function(allData) {
    if(){
        console.log("I'm here");
        ko.mapping.fromJS(allData, {}, self.form);
        console.log(self.form);
    }else{
        // not relevant
    }
});

答案 1 :(得分:0)

这是一个功能齐全的小提琴,能够满足您的需求:

http://jsfiddle.net/jearles/Cm4xS/

我用一个空的observable初始化表单,然后在AJAX调用返回时加载它。通过使用with绑定,我不会尝试在加载之前显示表单。