Question

我正在尝试从淘汰赛官方网站上实施“更好的列表示例”：http://knockoutjs.com/examples/betterList.html

我正在显示技能列表，除了多选的UI更新外，一切都很好用。当我单击“添加”按钮时，observable属性会立即更新，但要查看多重选择中的任何更改，我必须在UI中单击它，然后新的技能将出现在显示屏上。

我尝试使用更改和模糊事件：valueupdate：'更改'，没有成功。

模型

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);
};

无法立即进行multiselectselect更新

1 个答案: