2013-07-03 47 views
2

我想映射所有可能的JSON對象的嵌套對象,以便每個人都成爲可觀察對象。我的印象是,使用ko.mapping.fromJS會導致所有對象及其對象變得可觀察。但是,我沒有看到這種情況發生。Knockout.mapping是否使所有嵌套對象都可觀察?

如果您查看下面的JSFiddle和代碼,您會看到跨度最初顯示值「Test」。我的意圖是點擊按鈕來更新視圖模型,其內容爲stuff2,這應該將範圍的值更改爲「Test2」。但是,按鈕點擊不會更新任何內容。

http://jsfiddle.net/Eves/L5sgW/38/

HTML:

<p> <span>Name:</span> 
<span data-bind="text: IntroData.Name"></span> 
<button id="update" data-bind="click: Update">Update!</button> 
</p> 

JS:

var ViewModel = function (data) { 
    var me = this; 
    ko.mapping.fromJS(data, {}, me); 

    me.Update = function() { 
     ko.mapping.fromJS(stuff2, {}, windows.viewModel); 
    }; 

    return me; 
}; 

var stuff = { 
    IntroData: { 
     Name: 'Test' 
    } 
}; 

var stuff2 = { 
    IntroData: { 
     Name: 'Test2' 
    } 
}; 

window.viewModel = ko.mapping.fromJS(new ViewModel(stuff)); 
ko.applyBindings(window.viewModel); 

難道只是我必須利用映射選項有嵌套對象進行觀察的?如果是這樣,如果JSON對象如此龐大而複雜(這顯然不是)呢?是否可以使用一些遞歸功能來遍歷每個對象的嵌套對象以使它們全都可觀察?

+2

請注意,您拼寫'windows.viewModel'而不是'window.viewModel'。然而,改變這個給我一個「Max callstack size exceeded」的消息,仍然在思考爲什麼。在任何情況下,將參數更改爲'我'[做的伎倆](http://jsfiddle.net/L5sgW/39/)。 – Jeroen

+0

更改爲我當然適用於那個jsfiddle .....可悲的是,這並沒有解決實際頁面上的問題。一旦我找出小提琴和實際頁面之間的不同之處,我將不得不回到這個位置。 – Eves

+0

非常感謝你的幫助Jeroen。你絕對解決了一些導致我面臨真正問題的問題....當我開發時,我傾向於使用JavaScript中的Chrome開發人員工具和調試器進行工作。似乎淘汰賽和調試器+ Chrome開發者工具不能很好地一起玩。當我拿出調試器或關閉開發人員工具時,它按預期工作 – Eves

回答

0

修改更新功能如下所示。

me.Update = function() { 
    ko.mapping.fromJS(stuff2, {}, windows.viewModel); 
}; 
相關問題