2

我正在尝试在我的站点应用程序中实现 Typeahead，但到目前为止发现了一些问题。第一件事是关于我从服务器端发送到预输入的记录，即使我得到不止一行，它也只显示一行。

我的环境是：

  • 节点.JS;
  • 使用 Jade 模板引擎表达；
  • 引导程序
  • MongoDB。

在服务器端，我在输出数组上添加 mongo 获取的每一行：

        docs.forEach(function(e) {
            output.push({
                _id:e._id,
                name:e.name,
                date:e.dates[0].date.toString('dd/MM/yyyy'),
                type: 'Show',
                desc:S(e.description).stripTags().s
            })
        });

也将其作为 JSON 发送到 typeahead：

$('#header-search').typeahead({
    remote: '/layoutSearch?value=%QUERY',
    template:
        '<table style="width: 400px;"><tr><td><strong>{{name}}</strong></td><td style="float: right">{{date}} - <em>{{type}}</em></td></tr></table>' +
        '<p style="line-height: 100%; font-size: 11px">{{desc}}</p>'
    ,
    engine: Hogan,
    onselect: function(obj) {
        console.log('Selected: ' + obj);
    }
});

我的“标题搜索”代码（Jade）：

input#header-search.typeahead(type='text', placeholder='Search...', data-provide='typeahead', data-items='4')

在某处找到“数据项”并添加了它，但没有任何改变，而且“数据提供”，甚至名称字段都在预先输入的选项中指定。我的查询没问题，完全返回现有文档。

任何建议都将受到欢迎。

4

2 回答 2

6

我认为你需要这个：

valueKey – The key used to access the value of the datum in the datum object. Defaults to value.

所以试试这个：

$('#header-search').typeahead({
    remote: '/layoutSearch?value=%QUERY',
    valueKey: 'name',
    template:
        '<table style="width: 400px;"><tr><td><strong>{{name}}</strong></td><td style="float: right">{{date}} - <em>{{type}}</em></td></tr></table>' +
        '<p style="line-height: 100%; font-size: 11px">{{desc}}</p>'
    ,
    engine: Hogan,
    onselect: function(obj) {
        console.log('Selected: ' + obj);
    }
});

希望能帮助到你！

于 2013-08-03T10:39:32.573 回答
0

如果您Bloodhound用作引擎，我认为添加valueKey不会解决问题，但此解决方案似乎有效：

Typeahead.js / Bloodhound 只显示一个结果

这对我有用。

于 2016-02-14T16:12:09.900 回答