不能使multiselectselect更新立即

Question

我試圖從淘汰賽官方網站實現了「更好的列表例如」：http://knockoutjs.com/examples/betterList.html

我顯示的技能列表，一切都很正常，除了UI更新多選。當我單擊添加按鈕時，observable屬性立即更新，但要查看多選中的任何更改，我必須在UI中單擊它，然後顯示新的Skill。

我試圖使用改變和模糊事件：valueupdate：'change'，沒有成功。

型號

self.allSkills = ko.observableArray(""); 
self.skillToAdd = ko.observable(""); 
self.selectedSkills = ko.observableArray(""); 

self.addSkill = function() { 
        self.allSkills().push(self.skillToAdd()); 
        self.skillToAdd(""); 
       }; 

查看

<form data-bind="submit: $root.addSkill"> 
    <label>Required Skills:</label> 
    Add skill: <input type="text" data-bind="value: $root.skillToAdd, valueUpdate: 'afterkeydown'"/> 
    <button type="submit" data-bind="enable: $root.skillToAdd().length>0">Add</button> 
</form> 
<select multiple="multiple" data-bind="options: $root.allSkills, optionsText: $data, selectedOptions: $root.selectedSkills"> 
</select> 

Answer 1

你是推到底層陣列的價值。推入ObservableArray本身 -

self.addSkill = function() { 
    var valueToPush = self.skillToAdd(); 
    self.allSkills.push(valueToPush); 
    self.skillToAdd(null); 
};