在值之后加载选项时，KnockoutJS 丢失先前的值答案

【问题标题】：KnockoutJS losing previous value when loading options after value在值之后加载选项时，KnockoutJS 丢失先前的值
【发布时间】：2013-12-06 04:58:47
【问题描述】：

我正在通过AJAX 请求提供我的选项，而该值最初在选择中。但是Knockout 似乎删除了绑定选项中没有的值。

示例：http://jsfiddle.net/EVzrH/

Knockout 似乎使用selectExtensions（v3 的第 1699 行）来读取和写入选定的选项。在此新值与索引匹配，并通过再次获取索引和匹配数据返回。

如何避免我的数据丢失？

【问题讨论】：

标签： javascript mvvm knockout.js

【解决方案1】：

通常，我通过使用当前值预填充 observableArray 来处理此问题（不需要文本，因为您可能还不知道它）。

喜欢：

var viewModel = {
    val: ko.observable(1),
    opts: ko.observableArray([{ Id: 1 }])
};

然后，让 observableArray 在返回时填充实际值。

对于更通用的解决方案，您可以使用此答案第二部分中描述的自定义绑定：Knockout js: Lazy load options for select

这将为您预先填充 observableArray，并考虑到您可能设置了optionsValue，也可能没有设置。

【讨论】：

延迟加载解决方案比我自己的破解要好得多。谢谢！

【解决方案2】：

我可以在这里看到 2 个可能的选项。首先是在应用绑定之前填充 opts 数组：

var viewModel = {
    val: ko.observable(1),
    opts: ko.observableArray([])
};

viewModel.opts([
        { Id: ko.observable(1), Text: ko.observable("abc") }, 
        { Id: ko.observable(2), Text: ko.observable("someVal") }, 
        { Id: ko.observable(3), Text: ko.observable("other") }
    ]);
ko.applyBindings(viewModel);

这里是小提琴：http://jsfiddle.net/EVzrH/1/

或者如果由于某种原因您无法在应用绑定之前填充它，您可以保存值并再次分配它：

var viewModel = {
    val: ko.observable(1),
    opts: ko.observableArray([])
};
var value = viewModel.val();
ko.applyBindings(viewModel);

viewModel.opts([
        { Id: ko.observable(1), Text: ko.observable("abc") }, 
        { Id: ko.observable(2), Text: ko.observable("someVal") }, 
        { Id: ko.observable(3), Text: ko.observable("other") }
    ]);
viewModel.val(value);

这是一个小提琴：http://jsfiddle.net/EVzrH/2/

【讨论】：

【解决方案3】：

要么在填充选项后设置值，要么订阅选项：

viewModel.opts.subscribe(function() {
    viewModel.val(1);
});

http://jsfiddle.net/gCyP6/

【讨论】：

【解决方案4】：

通过注释掉一些淘汰代码以避免ko.dependencyDetection.ignore，我设法让它按照我想要的方式工作。

http://jsfiddle.net/EVzrH/3/

ko.bindingHandlers['value']['update'] = function (element, valueAccessor) {

ko.bindingHandlers['options']['update'] = function (element, valueAccessor, allBindings) {

唯一的问题是它没有被缩小，所以切换到缩小的库不起作用。

【讨论】：