敲除和可观察的阵列不匹配

Question

请考虑viewmodel中的以下属性

self.allValues = ko.observableArray();
self.selectedValues = ko.observableArray();

在编辑时,selectedValues包含来自数据库的值.这是问题所在:selectedValues包含的元素不包括在内allValues,但它们不是同一个实例.它们从属性值的角度来看是相同的,但实际上是不同的对象.

这导致每一次的淘汰赛采用indexOf了allValues使用从对象selectedValues始终未能找到对象.

我使用的selectedValues一个checked结合,但是没有检查包括在该阵列上的正确元素.

<div class="vars-list" data-bind="foreach: allValues">
    <input type="checkbox" data-bind="checkedValue: $data...(etc) 
       checked: selelectedValues"  />
</div>

是否有任何方法可以通过属性值而不是内存地址来匹配对象？

Answer 1

使用自定义绑定是一种方法.这checked是使用比较函数的绑定的变体.

ko.bindingHandlers.checkedInArray = {
    init: function (element, valueAccessor, allBindings) {
        ko.utils.registerEventHandler(element, "click", function() {
            var observable = valueAccessor(), 
                array = observable(), 
                checkedValue = allBindings.get('checkedValue'), 
                isChecked = element.checked, 
                comparer = allBindings.get('checkedComparer');

            for (var i = 0, n = array.length; 
                i < n && !comparer(array[i], checkedValue); 
                ++i) { }

            if (!isChecked && i < n) {
                observable.splice(i, 1);
            } else if (isChecked && i == n) {
                observable.push(checkedValue);
            }
        });
    },
    update: function (element, valueAccessor, allBindings) {
        var array = valueAccessor()(), 
            checkedValue = allBindings.get('checkedValue'), 
            comparer = allBindings.get('checkedComparer');

        for (var i = 0, n = array.length;
            i < n && !comparer(array[i], checkedValue); 
            ++i) { }

        element.checked = (i < n);
    }
};

jsFiddle:http://jsfiddle.net/mbest/4mET9/