Knockout 映射:为什么应用绑定会清除嵌套对象中的值?

Knockout Mapping: Why does apply bindings clear values from my nested objects?

我有一个包含很多嵌套对象和嵌套对象集合的 KO 模型。我使用 ko.mappings 映射选项来确保它们在模型创建期间正确生成,但值被清除。尝试从一个简单的下拉菜单开始并将对象绑定到它:

<select id="myList" name="SelectedSurvey" id="SelectedSurvey" class="form-control"
 data-bind="options: AvailableSurveys, optionsText: 'Name', value: SelectedSurvey, 
optionsCaption: '-- Select Survey --'"></select>

然后,获取一些数据,当在页面上创建新对象时,它工作正常,但是当试图从同一页面编辑现有记录时,下拉值永远不会被选中。当我检查 viewModel.SelectedSurvey() the value is undefined, but it only becomes undefined after I callapplyBindings()` 时。为什么会这样?我该如何解决?

这是一个工作示例:http://jsfiddle.net/6wLcr52y/3/

如果你打开控制台 运行 它,你会看到 applyBindings() 之前的日志被称为完整的 ViewModel,嵌套对象 SelectedSurvey() 是正确的 komapping 对象有值,但在它被调用之后。 SelectedSurvey() 变得未定义,因此我的下拉列表从来没有选定的值。

SelectedValue 参数似乎不想接受一个对象作为有效值。因此,一旦您应用绑定并认为未提供有效值,它就会清除 SelectedValue observable。

作为解决方法,我创建了一个解决方案,该解决方案使用 optionsValue 参数来接受 'Id' 属性 作为值。这将允许您通过仅传递一个 'Id' 值而不是整个 Survey 对象来保持对选择哪个调查的控制。

这需要您将 Knockout 版本更新到 3.4.0。您是否出于某种原因被锁定使用 2.2.1?

我还更新了您的 jsfiddle 以包含更易读的映射插件实现。希望这会解决您的问题:

var ViewModel = function(data) {
    var self = this;
    self.AvailableSurveys = ko.mapping.fromJS(data.AvailableSurveys);
    self.SelectedId = ko.observable(data.SelectedSurvey.Id);
    self.SelectedSurvey = ko.pureComputed(function () {
        for (i = 0; i < self.AvailableSurveys().length; i++) {
            if (self.AvailableSurveys()[i].Id() === self.SelectedId()) {
                return self.AvailableSurveys()[i];
            }
        }
    })
}

Fiddle: http://jsfiddle.net/dw1284/v1L5tw6h/3/