通过文本框选择类别和值？

Question

我想启用一个备用文本框（类似于我们在 StackOverflow 上的标签），其中有一个小的变化，用户应该能够为他们正在输入的标签指定一个类别。我的意思是：

--------------------------------------------------
| gender: male*, state: ----------------          | <--- this is a textbox
-----------------------|--------------|-----------
                       | Illinois     |
                       | Washington   |
                       ----------------

为了逐字解释，当用户开始输入“g”（显示“性别”）时，他们会收到建议，他们可以选择该选项并转到“：”，然后是性别建议（即“男性”和显示“女性”）。用户可以根据需要添加任意数量的标签，并且将显示一个“x”（上图中使用 *）以删除该标签。

是否有任何关于启用这种体验的工作？我对基于 Bootstrap 的实现特别感兴趣。

Answer 1

我建议 angular ui-select working demo

.

Answer 2

一个建议是使用ui.bootstrap.typeahead 搜索数据列表。 并在选择完成后添加bootstrap label。