因为想要很棒的alert，所以试着在npm上搜索了一下。 用手遮住脸的话，npm的package真的很多。
选择简单大方的ng-alerts，与大家分享使用过程。
环境： vs代码
ng-alerts提供了官方的demo和教程。 https://jaspero.co/resources/projects/ng-alerts
1 .官方demo个人资料demo位于页面底部，可以如下图所示调整各种参数。
1. message是警报的内容
2. type是alert的类型，有success、warning、error、info四种。
3. overlay是指当alert出现时使页面的其他部分变暗并覆盖
http://www.Sina.com/. closeonoverlayclick表示当显示alert时，可以通过单击页面的其他变暗部分来关闭alert
4. close button是指清除警报的按钮
33558 www.Sina.com/. alert duration是alert显示的时间长度
2 .使用步骤在官方教程的基础上一步一步进行：
@jaspero/ng2-alerts软件包NPM install-- save @ jaspero/ng2-alerts
在@NgModule中输入，JasperoAlertsModule模块先输入：
import { jasperoalertsmodule } from ' @ jaspero/ng2-alerts '；
@ ng module (imports : [ jasperoalertsmodule ]，declarations : [ app component ]， bootstrap : [ app component ] } exportclassappmodule { }必须在html中输入jaspero-alerts [ default settings ]=' options '/jaspero button class=' BTN BTN-pria mry ' (click )='alerttest () test/button位于您的component类中alert:alerttest ) )可以编写函数来尝试this._alert.create ) ' info如果要设置以下alert的各种参数，可以通过公式：布尔overlayclicktoclose？布尔值show close button？布尔达？编号； }在这里我写了一个类继承了这个接口。 先导入：
import { alert settings } from ' @ jaspero/ng2-alerts '；
exportclassalertsettingimplementsalertsettings { overlay }？布尔=真； overlayClickToClose？布尔=真； showCloseButton？布尔=真； duration？ number=5000； 控制器(overlay )？布尔，overlayClickToClose？ boolean，showCloseButton？布尔，duration？ 3360 number (this.overlay=overlay； this.overlayclicktoclose=overlayclicktoclose； this.show close button=show close button； this.duration=duration； }在刚才的调用中添加另一个配置参数，将duration添加到1000:alert test ((this._ alert.create )、) This is a message (或newalertsetting )中
版权声明：本文为博客原创文章，未经博客许可不得转载。