在前端开发中，经常需要实现一些输入框的自动补全、标签等功能。saaksin-ngx-chips 就是一款可以实现这些功能的 npm 包。下面我们就来详细介绍一下如何使用。
安装
--- ------- ------ -----------------
使用方法
1. 导入模块
------ - -------- - ---- ---------------- ------ - ------------- - ---- ---------------------------- ------ - ----------- - ---- ----------------- ------ - -------------- - ---- -------------------- ----------- ------------- --------------- -------- --------------- ------------ ---------------- ---------- -------------- -- ------ ----- --------- --
2. 添加 Chips 同步支持
将 FormsModule 导入项目的模块中，然后将 NgModel 绑定到你的属性上。
---------- ----------------------------------------
3. 添加 Chips 异步支持
首先，在 app.module.ts 文件中添加 HttpClientModule：
------ - ---------------- - ---- ----------------------- ----------- -------- --------------- ------------ --------------- ------------------ --
然后，在组件中设置输入框的属性：
---------- ----------------------- ------------------------------------ ------------------- ------ ---------- -- --- - --- ---- -------------
4. 添加 Chips 搜索支持
------ ----- ------------ -
----- - -
- --- -- ----- ------- --
- --- -- ----- -------- --
- --- -- ----- ------ --
- --- -- ----- ------- --
- --- -- ----- -------- -
--
-------------- -------- ----------------- -
------ ------------------------- -- --------------------------------------------------- - -----
-
-5. Chips 选项修饰
-----------
--------------- ----------- ---- -- ----------- ------------------
-------------
-----------------
------------6. Chips 自定义列表选项
-----------
------------ -----------------
------------------ ----------------------------------------
--------------
------------示例代码
------ - --------- - ---- ----------------
------ - ----------- -- - ---- -------
------ - ----------- - ---- --------------------
------------
--------- -----------
--------- -
-----------
--------------- ----------- ---- -- ------ ------------------
-- --------- --
-----------------
------------
-
--
------ ----- ------------ -
----- - -
- --- -- ----- ------- --
- --- -- ----- -------- --
- --- -- ----- ------ --
- --- -- ----- ------- --
- --- -- ----- -------- -
--
-本文介绍了 npm 包 saaksin-ngx-chips 的使用方法，希望能够帮助到各位前端开发者。它可以帮您实现输入框的自动补全、标签等功能，无需手动编写代码，非常方便。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6005601281e8991b448de115