Angular-Growl 是一个基于 AngularJS 的提醒插件，可以用来展示类似于消息通知、警告和错误的提示。该插件提供了很多可定制的选项，并且易于使用。
安装
首先，在项目中安装该包：
npm install angular-growl --save
然后在你的 HTML 文件中加入以下代码：
<link rel="stylesheet" href="bower_components/angular-growl-v2/build/angular-growl.min.css" /> <script src="bower_components/angular/angular.js"></script> <script src="bower_components/angular-growl-v2/build/angular-growl.min.js"></script>
配置
在你的 AngularJS 应用程序中注入 angular-growl 模块：
var app = angular.module('myApp', ['angular-growl']);
可以使用 provider 来配置插件的一些选项，如下所示：
app.config(['growlProvider', function(growlProvider) { growlProvider.globalTimeToLive(5000); }]);
上面的代码将全局的提示停留时间设置为 5 秒钟。其他常用的选项还有 globalPosition 和 globalDisableCountDown 等。
使用
在控制器或服务中注入 growl 服务即可使用。
-- -------------------- ---- ------- ------------------------ ---------- -------- ---------------- ------ - ------------------------- - ---------- - ----------------------- -- ----------------------- - ---------- - --------------------- -- ----展开代码
在 HTML 模板中，你可以直接使用以下指令：
<div growl></div>
上述代码将显示一个用于显示提示消息的容器。
示例代码
-- -------------------- ---- ------- --------- ----- ----- --------------- ------ ----- ---------------- -------------------- ------------ ----- ---------------- -------------------------------------------------------------------- -- ------- --------------------------------------------------- ------- ---------------------------------------------------------------------------- -------- --- --- - ----------------------- ------------------- ---------------------------- ----------------------- - ------------------------------------- ---- ------------------------ ---------- -------- ---------------- ------ - ------------------------- - ---------- - ----------------------- -- ----------------------- - ---------- - --------------------- -- ---- --------- ------- ----- ----------------------- ------- ------------------------------------------- ------- ----------------------------------------- ---- ------------ ------- -------展开代码
以上就是关于如何使用 angular-growl 的介绍。希望这篇文章能够帮助到需要使用此插件的读者们。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/36358
