与淘汰赛js中的自动完成文本框相关的问题答案

【问题标题】：Issue Related to Autocomplete Textbox in knockout js与淘汰赛js中的自动完成文本框相关的问题
【发布时间】：2017-05-05 12:43:34
【问题描述】：

我有带有 knockoutjs 的 web 应用程序

我必须在网络表单中实现自动完成文本框，

我得到了以下教程

https://www.npmjs.com/package/knockout.autocomplete

我添加了以下代码：

var viewModel = {
    keywords: ko.observableArray([
        'abstract', 'add', 'alias', 'as', 'ascending',
        'async', 'await', 'base', 'bool', 'break'
    ])
};
ko.applyBindings(viewModel);
<input data-bind="autocomplete: { data: keywords, maxItems: 6 }" value=""/>

它工作正常，但它只绑定文本，我想绑定文本和值对。

如何在上面的代码中实现？

谢谢

【问题讨论】：

举一个你想访问的数据的例子。每个项目是否有多个关键字？是否要将关键字或项目显示为建议？

标签： asp.net asp.net-mvc knockout.js

【解决方案1】：

我没有对此进行测试，但它看起来允许您传递格式化程序，因此您可以设置它将如何显示给用户。

var viewModel = {
  keywords: ko.observableArray([
    { name: 'Abstract', value: 'abstract' },
    { name: 'Break', value: 'break' }
  ]),
  format: function (value) {
    // This is what is shown in the list, only pass what you want
    return value.name;
  },
  selected: ko.observable(),
  onSelect: function (value) {
    // value should be your name/value object
    viewModel.selected(value);
  }
};

<input data-bind="autocomplete: {
    data: keywords, 
    maxItems: 6,
    format: format,
    onSelect: onSelect
}" value=""/>

【讨论】：