選項更改時選擇淘汰第一個選項

我正在使用<select>框通過淘汰賽綁定到一個計算值包裝ID和一個observableArray的選項。但是，將某個項目添加到選項數組時，選擇始終會更改爲第一個選項。我不能爲我的生活理解爲什麼。選項更改時選擇淘汰第一個選項

請參閱下面的示例。點擊按鈕添加一個選項並且注意選擇改變。如果我將選擇的綁定更改爲value: optionId, options: options, optionsValue: 'id', optionsText: 'name'，這似乎不會發生，但我想知道它爲什麼不能正常工作。

的jsfiddle：http://jsfiddle.net/5m8yud69/2/

HTML：

</select> 

<button data-bind="click: click"> 
Click me 
</button>

JavaScript的： VAR選項= ko.observableArray（）;

options.push({ id: 1, name: "one" }); 
options.push({ id: 2, name: "two" }); 
options.push({ id: 3, name: "three" }); 

var optionId = ko.observable(3); 
var option = ko.computed({ 
    read: function() { 
    var id = optionId(); 
    return ko.utils.arrayFirst(options(), function (option) { return option.id === id; }); 
    }, 
    write: function (value) { 
    optionId(value == null ? null : value.id); 
    } 
}); 

var model = { 
    optionId: optionId, 
    option: option, 
    options: options, 
    click: function() { 
    options.push({ id: 4, name: "four" }); 
    model.options(options); 
    } 
}; 

ko.applyBindings(model);

來源

2016-02-12 enoshixi

你的問題是此行的點擊功能：

model.options(options);

前一行已經更新了觀察到的陣列，但隨後該行嘗試將觀察到的陣列設置爲自身。（由於model.options是options的別名，因此該行相當於options(options)，這更明顯不正確）。

你最終會得到一個可觀察的數組。（Observable數組實際上並不阻止你將不是數組的東西放入其中）這不是你想要的，而是造成各種奇怪的錯誤。

只需刪除該行，您的代碼就可以正常工作。 Working version。

來源

2016-02-12 18:44:40 Retsam

選項更改時選擇淘汰第一個選項

回答

相關問題