數據綁定與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