使用Angular UI Bootstrap typeahead显示多个分组数据集？

Question

我正在构建一个需要使用预先输入的搜索功能，该功能会提示来自不同类型项目的多个数据集的结果。

我已将Angular UI Bootstrap's typeahead directive用于单个数据。文档提到了自定义模板，但没有提到支持结果分组。

例如，我希望能够输入＆＃34; san＆＃34;并查看人员和城市的结果，以及组标签：

城市

• 旧金山
• 圣地亚哥

人

• 桑塔纳
• 桑切斯
• 的Sandip

这是否可以使用Angular UI Bootstrap＆typeahead？

Answer 1

发现这个讨论非常有助于让我走上正轨：

AngularUI Bootstrap Typeahead Grouping Results

总体方法是：

1. 添加＆＃34;数据类型＆＃34;每组结果的标识符
2. 合并数据集
3. 在过滤期间，识别每种数据类型的第一项。
4. 自定义预先模板，查找＆＃34;首先＆＃34;标识符，并包含用于标记结果部分的其他HTML