即使有更多行，Typeahead也只顯示1行

Question

我試圖在我的網站應用程序中實現Typeahead，但到目前爲止發現了一些問題。第一件事是關於我從服務器端發送到預先打印的記錄，即使我得到多於一行，它也只顯示一行。

我的環境是：

• Node.js的;
• 用Jade模板引擎表達;
• Bootstrap
• MongoDB。

在服務器端我添加的每一行蒙戈獲取輸出數組：

 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到預輸入，以及：

$('#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') 

找到某處「data-items」並添加它但nothi ng改變，並且「數據提供」，甚至名稱字段在鍵入選項中指定。我的查詢是確定的，返回完全的現有文件。

任何建議將非常受歡迎。

Answer 1

我認爲你需要這樣的：

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

希望它能幫助！

Answer 2

如果您使用Bloodhound作爲引擎，我認爲加上valueKey不會解決問題，但這種方法似乎工作：

Typeahead.js/Bloodhound display just one result

這爲我工作。