1、简介
ngx-chips-fix 是一个 Angular 的自由输入框组件，它基于 ngx-chips 并添加了一些修复代码，以避免不必要的滚动和访问性问题。它可以让用户更方便地自由输入和选择多个选项，可以用于符号分隔的输入、电子邮件、标签等场景，这个组件非常灵活。
2、安装
在使用 ngx-chips-fix 之前，我们需要在项目中先安装它。打开终端，进入你的项目根目录，然后输入以下命令：
npm install ngx-chips-fix --save
3、如何使用
- 首先，在需要使用
ngx-chips-fix的模块中导入NgxChipsFixModule：
import { NgModule } from '@angular/core';
import { NgxChipsFixModule } from 'ngx-chips-fix';
@NgModule({
imports: [NgxChipsFixModule],
...
})
export class MyModule { }- 接下来，在你的 HTML 模板中放置
ngx-chips-fix组件。
<ngx-chips-fix [(ngModel)]="selectedItems"></ngx-chips-fix>
- 最后，在组件类中标注
selectedItems属性，这样你就可以通过这个属性获取所选的选项。
import { Component } from '@angular/core';
@Component({...})
export class MyComponent {
selectedItems: any[] = [];
...
}4、总结
ngx-chips-fix 是一个非常实用的组件库，它可以帮助我们快速实现一些自由输入场景。通过本文的介绍，相信你已经初步掌握了如何使用它，如果还有不明白的地方，可以通过官方文档获得更多信息。
-- -------------------- ---- -------
------ - --------- - ---- ----------------
------------
--------- -----------
--------- -
---- ------------------
----------------------
-------------- --------------------------- -----------------------
---- -------------
---------------
-- --------------------- ---------------------
------
----------------
------
--
------- -
-
---------- -
-------- -----
--------------- -------
---------------- -------
------------ -------
------- ------
-
-- -
---------- -----
-------------- -----
-
----- -
-------- -----
----------------- --------
-------- -----
-------------- -----
------------- -----
-
----------- -
------ --------
------- --------
------------ -----
-
-
-
--
------ ----- ------------ -
-------------- ----- - --------- ----------
-来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600668e3d9381d61a3540a49