复杂对象传递到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.