knockout.js selectedOptions不更新

我正在努力與knockout.js selectedOptions綁定。knockout.js selectedOptions不更新

我用observableArray中的項填充多選，A，選擇一些，將結果存儲在observableArray B中。當從數組A中刪除項時，B數組不會更新。

是這個淘汰賽的問題還是我做錯了什麼？

HTML代碼：

<h4>All items:</h4> 
<div data-bind="foreach: items"> 
    <p data-bind="text: name"></p> 
    <button data-bind="click: $parent.remove">Remove item</button> 
</div> 

<select multiple="multiple" data-bind=" 
    options: items, 
    selectedOptions: selectedItems, 
    optionsText: 'name', 
    optionsCaption: 'Choose one or more...' 
"></select> 

<h4>Selected items:</h4> 
<div data-bind="foreach: selectedItems"> 
    <p data-bind="text: name"></p> 
</div>

的Javascript：

var viewModel = { 
    items: ko.observableArray([ 
     { name: "Item 1", id: "1" }, 
     { name: "Item 2", id: "2" }, 
     { name: "Item 3", id: "3" } 
    ]), 
    selectedItems: ko.observableArray(), 
    remove: function(item) { 
     viewModel.items.remove(item); 
    } 
} 

ko.applyBindings(viewModel);

這裏的小提琴：http://jsfiddle.net/3FYAe/

如何重現：

選擇在一個或多個項目multise LECT領域，它們出現在下面的列表中（「選定項目」）
刪除所選項目
的選擇框更新

4.
- 預期之一：「選定項目「更新
- 實際：」選定項目「保留刪除的值

來源

2013-06-05 Corkscreewe

回答我的問題：

瑣碎的解決辦法是刪除selectedItems數組中的項目，以及，我。即

remove: function(item) { 
    viewModel.items.remove(item); 
    viewModel.selectedItems.remove(item); 
}

更新小提琴：http://jsfiddle.net/3FYAe/1/

不過，我想找到爲我處理更多的列表和更多的依賴一個更好的解決方案;這只是一個簡單的例子。

來源

2013-06-05 12:45:41 Corkscreewe

從Knockout的角度來看，'items'和'selectedItems'是兩個完全獨立的數組，有時候碰巧有相同的元素。因此，如果這是您的要求，則您有責任將這兩個陣列保留在sysnc中。 – nemesv

@nemesv我很希望selectedOptions綁定可以防止其中存在不存在的值 – Corkscreewe

您可以通過複製KO附帶的代碼來創建自定義的「betterSelectedItems」綁定。在你的版本中，訂閱'options'數組並在你的回調中從'selectedItems'數組中刪除任何不在'options'數組中的項。 – Brandon

knockout.js selectedOptions不更新

回答

相關問題