介绍
vivify-angular2-select 是一个 Angular 2 的 npm 包，用于实现带有搜索功能的下拉选择框。它使用了 Bootstrap 的样式，同时还提供了多个配置选项，包括多选、选项过滤、显示选中项等。
安装
可以通过 npm 安装该包，命令如下：
npm install vivify-angular2-select --save
使用
导入模块：
-- -------------------- ---- -------
------ - -------- - ---- ----------------
------ - ----------- - ---- -----------------
------ - -------------------------- - ---- -------------------------
-----------
-------- -
------------
---------------------------
--
--
------ ----- --------- - -使用下拉选择框：
<vivify-select [options]="options" [(ngModel)]="selectedOption" [multi]="true" ></vivify-select>
其中，options 变量为下拉选项数据，selectedOption 变量为选中项的数据，multi 为布尔值，表示是否允许多选。
示例
下面是一个完整的使用示例，包括选项的搜索和多选功能。
-- -------------------- ---- -------
------ - --------- - ---- ----------------
------------
--------- ---------
--------- -
--------------
-------------------
-----------------------------
--------------
-------------------
-----------------
-------- -------- -------------------
--
--
------ ----- ------------ -
------- - -
- ------ -------- ------ ------- --
- ------ --------- ------ -------- --
- ------ --------- ------ -------- --
- ------ ------- ------ ------ --
- ------ --------- ------ -------- --
- ------ ------------- ------ ------------ --
--
--------------- - ---
-参数
下面是该组件的主要参数及其说明：
options：下拉选项数组。selected：选中项。placeholder：输入框的提示语。multi：是否允许多选。maxOptions：最大选项数。searchable：是否显示搜索框。allowCustom：是否允许自定义。customText：自定义框的占位符。showSelected：是否显示选中项。clearOnSelect：选中后是否清空搜索框。clearOnClose：关闭下拉框时是否清空搜索框。
结论
vivify-angular2-select 可用于 Angular 2 项目中实现功能齐全、灵活多样的下拉选择框。在使用该包时，需要详细查看该包的参数配置和使用方法，并需根据具体项目需求进行修改。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600557b381e8991b448d4bb6