在表格中包装预先建议

Question

我正在尝试使用typeahead自动完成功能将其结果返回到表中.因为每个建议都是单独呈现的,所以没有任何地方可以包含表标记,而不会为每个建议呈现它.

我尝试使用页眉/页脚模板,在页眉中放置一个打开的表格标签,在页脚中放置一个关闭表标签,但建议不会呈现在表格中.

$('#orgSelector').typeahead(null, {
  name: 'orgSelector',
  source: orgSelector,
  display: 'name',
  limit: 20,
  templates:{
    empty: "<div>No matches</div>",
    header: Handlebars.compile("<table class='table injected-table'><tbody>"),
    suggestion: function (d){ return '<tr><td>' + d.name + '</tr></td>' },
    footer: Handlebars.compile("</tbody></table>")
  }
});

返回:

<div class="tt-dataset tt-dataset-orgSelector">
<table class="table injected-table">
    <tbody></tbody>
</table>
    <tr class="tt-suggestion tt-selectable"><td>D &amp; D Hardware </td></tr>
    <tr class="tt-suggestion tt-selectable"><td>D &amp; D Pharmacy</td></tr>
    <tr class="tt-suggestion tt-selectable"><td>D &amp; D Guns</td></tr>
    <tr class="tt-suggestion tt-selectable"><td>D &amp; D Marine</td></tr>
    <tr class="tt-suggestion tt-selectable"><td>D &amp; D Firearms</td></tr>
    <tr class="tt-suggestion tt-selectable"><td>D &amp; D Automotive</td></tr>
    <tr class="tt-suggestion tt-selectable"><td>D &amp; D Outfitters</td></tr>
    <tr class="tt-suggestion tt-selectable"><td>D &amp; D Sales</td></tr>
    <tr class="tt-suggestion tt-selectable"><td>D &amp; D Enterprises</td>
    </tr><tr class="tt-suggestion tt-selectable"><td>D &amp; D Farms</td></tr>
</div>
    </div>

需要它返回:

<div class="tt-dataset tt-dataset-orgSelector">
<table class="table injected-table">
    <tbody>
    <tr class="tt-suggestion tt-selectable"><td>D &amp; D Hardware </td></tr>
    <tr class="tt-suggestion tt-selectable"><td>D &amp; D Pharmacy</td></tr>
    <tr class="tt-suggestion tt-selectable"><td>D &amp; D Guns</td></tr>
    <tr class="tt-suggestion tt-selectable"><td>D &amp; D Marine</td></tr>
    <tr class="tt-suggestion tt-selectable"><td>D &amp; D Firearms</td></tr>
    <tr class="tt-suggestion tt-selectable"><td>D &amp; D Automotive</td></tr>
    <tr class="tt-suggestion tt-selectable"><td>D &amp; D Outfitters</td></tr>
    <tr class="tt-suggestion tt-selectable"><td>D &amp; D Sales</td></tr>
    <tr class="tt-suggestion tt-selectable"><td>D &amp; D Enterprises</td>
    </tr><tr class="tt-suggestion tt-selectable"><td>D &amp; D Farms</td></tr>
</tbody>
</table>
</div>