在前端开发中，经常会用到下拉框组件。但是原生的下拉框外观简单，无法满足我们的需求。这时候，第三方的下拉框组件就显得尤为重要了。其中，ng5-select2-ex是一款基于Angular5的下拉框组件，使用简单、功能强大，是我们前端开发中的好帮手。下面，我们就来学习一下如何使用ng5-select2-ex。
安装
使用ng5-select2-ex需要先安装它：
--- ------- -------------- ------
使用
使用ng5-select2-ex需要在你的module中引入它：
------ - ------------------ - ---- -----------------
-----------
-------- - ------------------ --
---
--
------ ----- --------- - -接下来，在你的组件中使用ng5-select2-ex。例如，我们需要使用ng5-select2-ex生成一个城市列表：
--------------- ----------------------------------
------- --------------------------------
------- -------------------------------
------- ---------------------------------
------- --------------------------------
-----------------我们可以通过valueChanged事件获取选中的值，并在onChange事件中处理。例如，我们可以在控制台输出选中的值：
----------------------- ---- -
---------------------------
-参数
ng5-select2-ex提供了丰富的参数供我们自定义下拉框的样式和功能。
data
data参数用于指定下拉框中的选项，可以是一个数组，也可以是一个Observable对象。
----- ---------- - -----------------
multiple
multiple参数用于指定是否多选。如果是多选，则返回的值为一个数组。
--------- -------
placeholder
placeholder参数用于指定下拉框的提示语，当未选中任何选项时显示。
------------ ------
width
width参数用于指定下拉框的宽度。
------ ------
allowClear
allowClear参数用于指定是否允许清空选项。
----------- -------
disabled
disabled参数用于指定下拉框是否可用。
--------- -------
minimumInputLength
minimumInputLength参数用于指定最小输入长度。这是一个异步操作，我们可以在返回的Observable对象中指定下拉框中的选项。
------------------- ------
ajax
ajax参数用于指定使用异步加载选项。这也是一个异步操作，我们可以在返回的Observable对象中指定下拉框中的选项。需要注意的是，如果使用了ajax参数，则不能使用data参数。
----- -
---- -------
--------- -------
------ -------
--------------- ------ ---- -- -
------ -
-------- ----
--
-
-总结
ng5-select2-ex是一款非常好用的下拉框组件，使用简单、功能丰富。通过本文的介绍，我们学会了如何使用ng5-select2-ex以及如何自定义它的样式和功能。在我们的实际开发过程中，ng5-select2-ex也会为我们提供极大的帮助。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60065f80238a385564ab6b2a