简介
angular-comp 是一个针对 Angular 框架的 UI 组件库，提供了一些常见的 UI 组件和功能模块，可以大幅简化开发过程，减少重复的工作量。
本文将介绍 angular-comp 的基本使用方法，以及常用组件的详细介绍和应用示例，帮助读者更好地掌握这个组件库，并在实际项目中得心应手地使用它。
安装
angular-comp 通过 npm 进行安装，您需要在命令行中执行以下命令来进行安装：
npm install angular-comp --save
其中，--save 参数表示将此包添加到项目的依赖中。
使用
安装完成后，您可以在需要使用的 Angular 组件中，通过 import 语句引入需要的组件，例如：
import { AlertComponent } from 'angular-comp';然后在该组件的 @NgModule 装饰器中，导入和声明这个组件：
-- -------------------- ---- -------
------ - -------- - ---- ----------------
------ - ------------- - ---- ----------------------------
------ - ------------ - ---- ------------------
------ - -------------- - ---- ---------------
-----------
------------- -
-------------
-------------- -- --
--
-------- -
-------------
--
---------- ---
---------- --------------
--
------ ----- --------- - -然后就可以在该组件的 HTML 模板中使用这个组件了：
<app-alert></app-alert>
在以上代码中，app-alert 就是对应的 AlertComponent 组件。
常用组件介绍
AlertComponent
AlertComponent 是一个用于显示提示信息的组件，支持多种类型的提示信息，如成功、错误、警告等。它的使用方法非常简单，只需要在 HTML 模板中添加以下代码：
<app-alert type="success" message="操作成功"></app-alert>
其中 type 属性表示提示信息的类型，可选值为：info（信息）、success（成功）、warning（警告）、danger（危险）。message 属性表示具体的提示信息。
PaginationComponent
PaginationComponent 是一个用于分页的组件，支持多种不同样式和布局。它的使用方法如下：
<app-pagination [total]="100" [(page)]="currentPage"></app-pagination>
其中，total 属性表示总共有多少条数据，page 双向绑定属性表示当前页码。当用户翻页时，page 属性会自动更新。
ModalComponent
ModalComponent 是一个用于弹出模态框的组件，支持自定义模态框的标题、内容和按钮等，可以添加多个按钮，并在用户点击按钮时触发自定义的事件回调函数。它的使用方法如下：
-- -------------------- ---- -------
------ - ---------- --------- - ---- ----------------
------ - -------------- - ---- ---------------
------------
--------- -----------
--------- -
------- ---------- ------------ ------------------------------------
---------- ---------
-------------------------------------
----------------
----------
-----------------
------------------
------- ---------- ------------ ------------------------------------
------- ---------- ----------- ------------------------------
-------------------
------------
-
--
------ ----- ------------ -
--------------------- - ------- ---- -- -------- ---------------
----------- -
--------------------
-
-------- -
-- ----
-
-在以上代码中，我们使用了 ViewChild 装饰器来获取模态框组件，并在点击按钮时调用 myModal.show() 方法来显示模态框。当用户点击删除按钮时，调用 delete() 方法来执行删除操作。最后，通过 myModal.hide() 方法来隐藏模态框。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005535b81e8991b448d0961