前言
mge-angular-library 是一个 Angular 应用程序的 UI 组件库。它设计了大量可重用的组件，用于构建现代的 Web 应用程序。在本文中，我们将深入探讨该 npm 包的安装和使用方法。
安装
该 npm 包的安装非常简单。可以使用 npm 或者 yarn 进行安装，具体方式如下：
# 使用 npm 进行安装 npm install --save mge-angular-library # 使用 yarn 进行安装 yarn add mge-angular-library
安装完成后，该库就可以在任意 Angular 应用中使用了。
使用
为了在 Angular 应用中使用该组件库，首先我们需要在相应的模块文件中引入库中的组件。下面是一个基本示例：
-- -------------------- ---- -------
------ - ------------- - ---- ----------------------------
------ - -------- - ---- ----------------
------ - ------------ - ---- ------------------
------ - ----------------------- - ---- ----------------------
-----------
------------- -
------------
--
-------- -
--------------
-----------------------
--
---------- ---
---------- --------------
--
------ ----- --------- - -在上面的示例代码中，我们介绍了如何导入 mge-angular-library 中的组件，并将其添加到应用程序的模块中。
下面的代码是一个示例组件，它使用了 mge-angular-library 库中的 ngAutocomplete 组件：
<mge-autocomplete [items]="items"></mge-autocomplete>
接下来，我们将详细介绍该组件的使用方法。
ngAutocomplete 组件
ngAutocomplete 组件提供了一个交互式文本框，用户在文本框中键入字符后，可以在下拉列表中看到与其匹配的项目。从下拉列表中选择一个项目后，该项目将填充到文本框中。
下面是一个完整的 mge-autocomplete 示例：
-- -------------------- ---- -------
------ - --------- - ---- ----------------
------------
--------- -----------
--------- -
-----------------
---------------
----------------------------------
-------------------
--
--
------ ----- ------------ -
------ -------- - ----------- -------- ------ ---------
------------------ ------- -
--------------------- ----- -- ------
-
-在上面的示例代码中，我们使用了 mge-angular-library 中的 MgeAutocomplete 组件，并传入了一个字符串数组。当用户在文本框中键入字符后，下拉列表会显示匹配的项目，用户可以选择其中的项目，该项目则会显示在文本框中，并触发选项的selected事件，以便执行相应的操作。
结论
mge-angular-library 是一个非常实用的 Angular 应用程序 UI 组件库，提供了大量可重用的组件，用于构建现代的 Web 应用程序。本文介绍了该库的安装和使用方法，对于想要学习该组件库的读者，可以参考上述的示例代码。试试运用它们来构建你的下一个 Web 应用程序吧！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005667e81e8991b448e28f4