数据绑定与Knockout JS不工作

Question

我想绑定我的JSON对象到一个HTML div但没有绑定似乎工作。这是我目前对这个主题的尝试。但我已经尝试过使用模板绑定了。这导致了一个未定义的错误，但该对象正确加载，因为我总是把它在控制台中。

$(document).ready(function() { 
var submissionViewModel = new SubmissionModel(); 
submissionViewModel.getSubmission().done(function() { 
    ko.applyBindings(submissionViewModel, document.getElementById("submission")); 
}) 
}); 

var SubmissionModel = function() { 
var self = this; 
//self.loading = ko.observableArray(); 
self.Submission = ko.observable(null); 

self.getSubmission = function() { 
    // Let loading indicator know that there's a new loading task that ought to complete 
    //self.loading.push(true); 

    return $.getJSON('/Submission/GetSubmission', 
     function (data) { 
      console.log("submission loading") 
      console.dir(data); 

      self.Submission = ko.mapping.fromJSON(JSON.stringify(data)); 
     } 
    ); 
} 
} 

HTML

<div id="submission" data-bind="with: Submission"> 
<span data-bind="text: SubmissionTitle"></span> 
</div> 

JSON

"{" 
SubmissionID":"1be87a85-6d95-43aa-ad3c-ffa047b759a5", 
"SubmissionTitle":"nog wat sliden", 
"SubmissionDescription":"////", 
"SubmissionFile":"TESTFILE ", 
"CreatedOn":"2015-09-02T21:10:54.913", 
"SubmissionPoolID":"5af408f5-515c-4994-88dd-dbb2e4a242a2", 
"SubmissionTypeID":1, 
"CreatedBy":"a028a47d-3104-4ea4-8fa6-7abbb2d69bbd 
"}" 

我一直在嚼在这个问题上了几天的我似乎无法得到它的工作。你们中的任何一个人能否指出我正确的方向？

Answer 1

在Java的脚本来解码串里面，你需要使用JSON.parse并确保你的对象是在not这样的方式构建双引号里面双引号的对象。

视图模型：

var json = '{"SubmissionID":"1be87a85-6d95-43aa-ad3c-ffa047b759a5","SubmissionTitle":"nogwatsliden","SubmissionDescription":"--","SubmissionFile":"TESTFILE ","CreatedOn":"2015-09-02T21:10:54.913","SubmissionPoolID":"5af408f5-515c-4994-88dd-dbb2e4a242a2","SubmissionTypeID":1,"CreatedBy":"a028a47d-3104-4ea48fa67abbb2d69bbd"}' 
var ViewModel = function() { 
    this.Submission = ko.observable(); 
    this.Submission(ko.mapping.fromJS(JSON.parse(json))); 
    //you can also use ko.mapping.fromJSON(json) as jeroen pointed out 
}; 
ko.applyBindings(new ViewModel()); 

工作样本here