4

我有一个带有可观察的子视图模型数组的视图模型。

这些应该是用户可排序的，所以我使用的sort()方法是observableArray：

function ViewModel() {
    this.items = ko.observableArray([/* ... some items ... */]);
    this.sort = function () {
        this.items.sort(function (a, b) {
            // comparison
        }
    }
}

每个项目都有一个type可观察的，通过绑定绑定到单选框列表checked。

<li>
    <input type="radio" value="A" data-bind="checked: type" /> A
    <input type="radio" value="B" data-bind="checked: type" /> B
    <input type="radio" value="C" data-bind="checked: type" /> C
    <input type="radio" value="D" data-bind="checked: type" /> D
</li>

现象是当items数组被排序时，单选框随机丢失它们的状态，即对于它们的看似随机的子集，屏幕上看不到任何点——即使它们的值仍然保留在视图模型中。

自己试试：http: //jsfiddle.net/yxg53bph/——点击“排序”几次，观察效果。

简单的问题：这里出了什么问题，我该如何解决？

排序后调用notifySubscribers()单个项目修复了显示问题。然而，这是一个黑客，而不是一个解决方案。

4

1 回答 1

3

在您的 jsfiddle 中，您设置了name属性，这就是导致这种错误行为的原因。

我不认为这是淘汰赛中的错误。只是在排序时，单选项将由敲除处理程序和浏览器本身同时设置（因为单选组只能选中1个单选按钮）。

如果您删除 name 属性（这没关系，因为所有 4 个单选按钮都绑定到同一个字段，因此将遵守唯一的 1 个 ckecked 约束），排序将按预期运行。

演示：jsfiddle

于 2014-09-18T14:27:30.430 回答