twitter-bootstrap Angular UI 引导程序：提前输入选择多个
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/25996917/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Angular UI bootstrap: Type ahead select multiple
提问by Syed
I am using angular UI bootstrap type-ahead directive for type-ahead in a form
我在表单中使用 angular UI bootstrap type-ahead 指令进行提前输入
http://angular-ui.github.io/bootstrap/
http://angular-ui.github.io/bootstrap/
I am fetching the records from remote server via $httpservice. It is working fine.
However I can select only one element from list at a time.
我正在通过$http服务从远程服务器获取记录。它工作正常。但是我一次只能从列表中选择一个元素。
I want to select multiple values from the list and show all currently selected element in input field with a remove button just like tags for SO. The selected tags are stored in angular array model.
我想从列表中选择多个值，并在输入字段中显示所有当前选定的元素，并带有一个删除按钮，就像 SO 的标签一样。选定的标签存储在角阵列模型中。
How to achieve this ?
如何实现这一目标？
I have read documentation for Angular UI bootstrap but I am not able to find anything.
我已阅读 Angular UI 引导程序的文档，但我找不到任何内容。
回答by m.brand
This guy made a directive for this. Should do exactly what you want and it's even using the ui-bootstraps typeahead.
这家伙为此做了一个指示。应该完全按照您的意愿去做，它甚至可以使用 ui-bootstraps typeahead。
回答by Kevin Burton
The best solution I have found so far is io.selectit does exactly what you require, multi-select typeahead. and the markup is neat and clean too e.g:
到目前为止我找到的最好的解决方案是io.select它完全符合您的要求，多选输入。并且标记也很整洁，例如：
<oi-select
oi-options="list.id as list.description for list in lists"
ng-model="tags"
multiple
placeholder="Select">
</oi-select>
This component is also compatible with bootstrap and the new bootstrap 4.
该组件还与 bootstrap 和新的 bootstrap 4 兼容。
回答by Raviraj
In js file :
在js文件中：
To list all selected items, use $item with typeahead-on-select and push to an array for ex.evtMem. delete fn to delete selected item.
要列出所有选定的项目，请使用 $item 和 typeahead-on-select 并推送到 ex.evtMem 的数组。delete fn 删除所选项目。
HTML : Use table to list all array values using ng-repeat. Addition to that add remove glyphicon image and function to delete corresponding item.
HTML : 使用 table 使用 ng-repeat 列出所有数组值。除此之外，还添加了删除字形图像和删除相应项目的功能。
