Question

我正在尝试创建一个可编辑的组合框。这是我写的HTML：

<select data-bind='options: possibleOptions, value: selectedOption' onchange='this.nextElementSibling.value = this.value'></select>
<input type='text' name='format' data-bind='value: selectedOption, valueUpdate:[\"afterkeydown\", \"click\", \"input\", \"change\"]' />

在http://jsfiddle.net/nwH8A/的帮助下。

所以当我手动输入文本输入时，selectOption会正确更新。但是当我从下拉列表（possibleOptions）中选择一个选项时，除非我单击文本框，否则selectedOption的值不会更新。基本上我要做的是允许用户手动输入文本，并从下拉列表中选择并相应地更新selectedOption的值。

是否有任何事件需要添加到valueUpdate事件列表中，还是有其他方法可以完成结果？

我正在使用打字稿文件。

感谢。

Answer 1

我不确定我是否理解你的问题......试试这个：

 function ViewModel() {
    var self = this;
    self.possibleOptions = ko.observableArray([ { text: '1', value: '1' }, { text: '2', value: '2' } ]);
    self.selectedOption = ko.observable();

    self.selectedOption.subscribe(function (newValue) {
        self.possibleOptions.push({ text: newValue, value: newValue });
    });
};

ko.applyBindings(new ViewModel());

HTML

<select data-bind="options: possibleOptions, optionsText: 'text', optionsValue: 'value', value: selectedOption">

</select>

<input type="text" name="format" data-bind="value: selectedOption" />

要查看此工作：https://jsfiddle.net/q6ov7r59/3/

valueUpdate事件用于选择选项中的更改

1 个答案: