1

在手动将选项添加到绑定选择元素的场景中，可观察对象的原始值在 applyBindings 之后丢失。如果使用选项绑定添加选项，则该值不会丢失。我在这里演示了效果：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>
4

2 回答 2

0

我不明白这里的问题。如果您查看淘汰赛如何绑定您展示的示例是完全正确的。如果您想添加一个选项，只需使用choices.push(newOption);

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

如果您想以不同的方式设置值（不使用 Id），那么您可以通过将对象传递给 ChoiceA 可观察对象而不是 Id 来实现。在您的代码示例中，您没有指定 optionValue 应该是 Id 但您传递的是 Id 而不是选定的 observable (ChoiceA) 并且无论如何您都在破坏绑定。

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

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

它将选择一个选项

于 2013-09-20T09:53:14.330 回答
-1

以前我自己手动绑定这样的选择列表时遇到问题和奇怪的行为。只需坚持使用选项绑定。

于 2013-09-20T11:55:29.237 回答