Knockout и наблюдаемый массив несовпадение

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/