當數組由對象組成時，Knockout checkedValue綁定不起作用

我在我的網站上遇到了一個奇怪的問題。我正在使用ASP.NET MVC將模型數據發送到頁面。當數組由對象組成時，Knockout checkedValue綁定不起作用

我顯示了一個基於Javascript數組中的對象的複選框列表。加載頁面時，它會正確顯示項目，但不會選擇所選項目數組中的項目。

這是HTML的樣子。

<!-- ko foreach: items --> 
    <p> 
     <input type="checkbox" 
       data-bind="checkedValue: $data, checked: $root.selectedItems" /> 
     <span data-bind="text: Name"></span> 
    </p> 
<!-- /ko -->

這是Javascript的樣子。

var Item = function (id, name) { 
    this.Id = id; 
    this.Name = name; 
}; 

var model = { 
    items = ko.observableArray([]), 
    selectedItems = ko.observableArray([]) 
}; 

@foreach (var serverItem in serverItems) { 
    @:model.items.push(new Item('@serverItem.Id', '@serverItem.Name')); 
} 
@foreach (var selectedServerItem in selectedServerItems) { 
    @:model.selectedItems.push(new Item('@selectedServerItem.Id', '@selectedServerItem.Name')); 
} 

ko.applyBindings(model);

你會認爲它會被選中，因爲對象是相同的，但事實並非如此。當我選中複選框時，它會將其他項添加到selectedItems陣列中，而不是使用現有的項。

['1', 'Business To Business'], ['2', 'Business To Consumer'], ['1', 'Business To Business']

任何人都可以向我解釋爲什麼會發生這種情況嗎？爲什麼Knockout不理解複選框需要根據對象而不是基元來檢查？

解決方案我結束了：

var items = []; 
@foreach (var serverItem in serverItems) { 
    @:items[@serverItem.Id] = {Id: '@serverItem.Id', Name: '@serverItem.Name'}; 
    @:model.items.push(items[@serverItem.Id]); 
    if (selectedServerItems.Any(si => si.Id == serverItems.Id) 
     @:model.selectedItems.push(items[@serverItem.Id]); 
}

現在複選框被選中正確的頁面加載時。

來源

2014-02-17 dimiguel

對象是相同的，但它們是不同的實例。 Knockout執行==（或可能是===）來比較項目，並且在JavaScript中，對於2個不同的對象實例，即使它們在內部它們都是相同的，它總是會返回false。但是，這對字符串很好。

var foo1 = {foo: 1}; 
var foo2 = {foo: 1}; 
var foo3 = foo1; 

console.log(foo1 == foo2); // false 
console.log(foo1 == foo3); // true

你可以看到，在這個小提琴的動作... http://jsfiddle.net/Nk86C/1/

來源

2014-02-17 07:16:21

哇...我不能相信這是一件這麼簡單。非常感謝。 – dimiguel

終於明白了爲什麼我有同樣的問題，太棒了！我也做了一個快速jsfiddle更好地理解這個：http://jsfiddle.net/9fb369p1/3/ –

當數組由對象組成時，Knockout checkedValue綁定不起作用

回答

相關問題