在前端开发中，我们时常需要通过弹窗、提示框等方式告知用户一些信息，而 angularx-flash-message 就是一款可以快速实现这个功能的 npm 包。本文将介绍 angularx-flash-message 的基本用法和常用参数，希望对前端开发者有所帮助。
安装和依赖
安装 angularx-flash-message 很简单，只需在命令行中输入以下命令：
npm install angularx-flash-message --save
安装完成后，你需要在你的 Angular 项目中引入和导入该包：
-- -------------------- ---- -------
-- ----------
------ - ------------------- - ---- -------------------------
-----------
-------- -
-----------------------------
-
--
------ ----- --------- - -
-- --------------
------ - -------------------- - ---- -------------------------
------------
--------- --------------
------------ ---------------------------
---------- ---------------------------
--
------ ----- ---------------- -
------------------- --------------------- --------------------- - -
-基本用法
angularx-flash-message 插件的使用非常简单，只要在需要的地方调用该插件的 API 即可。
在 HTML 文件中，你需要使用该插件提供的组件：
<flash-messages></flash-messages>
在你 angular 组件中，你需要使用该插件提供的服务：
-- -------------------- ---- -------
-- --------------
------ - -------------------- - ---- -------------------------
------------
--------- --------------
------------ ---------------------------
---------- ---------------------------
--
------ ----- ---------------- -
------------------- --------------------- --------------------- - -
-- ------------ --- --
------------- -
------------------------------------------ - --------- --------------- -------- ---- ---
-
-常用参数
text: 提示框中需要显示的文字cssClass: 提示框的样式，比如 alert-info、alert-danger、alert-success 等，也可以自己定义样式。timeout: 提示框显示的时间，以毫秒为单位，设置为 0 将让提示框一直显示，当用户点击提示框时再消失。
示例代码
下面是一个基本的使用示例：
<flash-messages></flash-messages> <button (click)="showSuccess()">成功</button> <button (click)="showError()">失败</button> <button (click)="showWarning()">警告</button>
-- -------------------- ---- -------
------ - --------- - ---- ----------------
------ - -------------------- - ---- -------------------------
------------
--------- --------------
------------ ---------------------------
---------- ---------------------------
--
------ ----- ---------------- -
------------------- --------------------- --------------------- - -
------------- -
-------------------------------------- - --------- ---------------- -------- ---- ---
-
----------- -
-------------------------------------- - --------- --------------- -------- ---- ---
-
------------- -
------------------------------------------------ - --------- ---------------- -------- - ---
-
-总结
angularx-flash-message 是一款非常好用的 npm 包，它使用简单，而且可以通过自定义样式满足各种需求，希望读者能够通过本文了解该插件的基本使用方法和常用参数，实现快速构建优秀的前端应用程序。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055fc381e8991b448dd1f9