複雜對象傳遞到ko.mapping.fromJS

Question

我有一個複雜的對象我想要傳遞到ko.mapping.fromJS，我的問題是，我只想要一個場可觀察到，但其他性能給人的印象null或不存在基於我嘗試過的方法。

我創建了一個的jsfiddle here來說明我的問題。我希望內部對象能夠被複制，因爲我不需要它是可觀察的;考慮到這些我將擁有的數量，我不想額外的開銷。

這樣做的目標是使qty可編輯，但inner.name在文本框中保持不變。這意味着一個是可觀察的，而另一個不是。

如果任何人有這樣做的另一種方式，不涉及我很想聽到它的映射。我的視圖模型有很多功能，並且數據來自AJAX調用。

function viewModel() { 
    var self = this; 
    self.slots = ko.observableArray([]); 

    self.load = function() { 
     ko.mapping.fromJS(
      [ 
       { 'qty': 1, 'inner': { 'name': 'thing'} }, 
       { 'qty': 2, 'inner': { 'name': 'stuff'} } 
      ], 
      { 'include': ['qty'], 'ignore': ['inner.name'] }, 
      self.slots); 
    } 
}; 

ko.applyBindings(new viewModel()); 

<button data-bind="click: load">Go</button> 
<ul data-bind="foreach: slots"> 
    <li> 
     <span data-bind="text: qty"></span>&nbsp;<span data-bind="text: inner.name"></span><input data-bind="value: qty" /><input data-bind="value: inner.name" /> 
    </li> 
</ul> 

Answer 1

您需要使用copy而不是ignore因爲你想擁有的屬性那裏只是沒有觀察到。

而且因爲在直接映射的陣列的映射結構變得有點複雜。

你不能對「根」級別定義copy，因爲你必須在根目錄下的陣列。所以，你必須提供一個create功能的項目，並在創建功能，您現在可以指定項目的屬性copy選項：

ko.mapping.fromJS(
     [ 
      { 'qty': 1, 'inner': { 'name': 'thing'} }, 
      { 'qty': 2, 'inner': { 'name': 'stuff'} } 
     ], 
     { 
      create: function (options) { 
       return ko.mapping.fromJS(options.data, { 
        copy: ['inner.name'] 
       }) 
      } 
     }, 
     self.slots); 

演示JSFiddle.