Question

在将选项手动添加到绑定选择元素的情况下，在applyBindings之后，observable的原始值将丢失。如果使用选项绑定添加选项，则不会丢失该值。我在这里证明了效果：http://jsfiddle.net/nigelw/CkyjC

编辑： 请注意，我正在谈论选择的初始创建/绑定 - 而不是稍后向现有选择添加选项。

这是否有原因？

示例代码：

<!-- In this test, select options are added manually within a
            foreach construct. Select works as expected, but initial
            value of observable is cleared. -->
<select data-bind="value: ChoiceA">
    <!-- ko foreach: Choices -->
    <option data-bind="text: Name, value: Id"></option>
    <!-- /ko -->
</select>

<p>ChoiceA = [<span data-bind="text: ChoiceA"></span>]</p>

<!-- In this test, select options are added using options binding.
        Select works as expected and initial value of observable is kept. -->
<select data-bind="options: Choices, optionsText: 'Name', optionsValue: 'Id', value: ChoiceB"></select>

<p>ChoiceB = [<span data-bind="text: ChoiceB"></span>]</p>

<script type="text/javascript">
    var model = {
        // Store the selection here. Initialised to 3. This selects
        // the correct option, but the value then disappears until a
        // new selection is made.
        "ChoiceA": ko.observable(3),

        // Store the selection here. Initialised to 3. This selects
        // the correct option, and the value stays as expected.
        "ChoiceB": ko.observable(3),

        // The options
        "Choices": ko.observableArray([
            { Id: 1, Name: "Option1" },
            { Id: 2, Name: "Option2" },
            { Id: 3, Name: "Option3" }])
    };

    ko.applyBindings(model);
</script>

Answer 1

我不明白这里的问题。如果你看一下knockout如何绑定你展示的例子是完全正确的..如果你想添加一个选项，只需使用choices.push（newOption）;

如果您设置一个值然后覆盖它，您将遇到问题，但这正是淘汰应该如何工作。

如果你想以不同的方式设置一个值（不使用Id），那么你可以通过将一个对象传递给ChoiceA observable而不是Id来做到这一点。在您的代码示例中，您没有指定optionValue应该是我的，但是您传递的是Id而不是选定的observable（ChoiceA），并且您仍在破坏绑定。

例如，如果您将代码更改为 -

var ChoiceA = ko.observable(choices()[0]);

它会选择一个选项

Answer 2

用于自己手动绑定像这样的选择列表有问题和奇怪的行为。只需坚持使用选项绑定。

手动添加选择选项会导致清除可观察值

2 个答案: