javascript - AngularJS typeahead 搜索结果在 div 中

Question

我正在使用 bootstrap 的 typeahead 进行文本输入，它还有一个按钮可以弹出一个流行的结果弹出窗口。

我想要 typeahead 的功能，只是结果列表将显示在不同的 div 中(在弹出框内而不是在文本输入下)。

有没有办法为预输入搜索结果设置“容器”？ (例如弹出窗口小部件包含一个“容器”选项)

像这样:

Text Field    Button          popover
________________________________________________________
|   Search...  | B |  Typeahead1    Popular Searches:  |
|--------------|---|  Typeahead2    Src1               |
                   |  Typeahead3    Src2               |
                   |  ....          ...                |
                   |___________________________________|

(如果在 photoshop 中绘制会更快，但是嗯...)

有什么好的解决方案吗？我考虑了几种方法:修改/扩展 typeahead 插件或使用隐藏文本输入。也许我可以改用 jquery 的自动完成功能。还有其他(更好的)建议吗？

注意:我使用的是jquery+angularjs+bootstrap

Answer 1

据我所知，来自 http://angular-ui.github.io/bootstrap/ 的 typeahead 指令的代码(自从我写完之后我就知道了 :-))你将无法仅通过配置来完成你在这里要求的事情。

您需要 fork 它并适应您的需要。它应该非常简单。如果您觉得应该更改指令中的任何内容以使其更易于扩展，请随时打开 GitHub 问题。