Question

我是角度2＆amp;的新手4.我想用ngx-bootstrap警报和模态创建自定义通知。我搜索了一些样本。但那些并不简单。我只需要一个简单的蓝图来创建服务，接口和组件的通知。

请任何人用示例代码指导我。

Answer 1

ngx-bootstrap - Alerts的官方文档 ngx-bootstrap - Modals的官方文档其中提供的API文档和使用方案以及实际示例。

为了快速参考，我将为您提供一个简单警报框的代码 - 下面的用法和演示：

首先，使用以下方法导入Root模块中的ngx-bootstrap

import { AlertModule } from 'ngx-bootstrap';

@NgModule({
  imports: [AlertModule.forRoot(),...]
})
export class AppModule(){}

这是HTML部分template：

<alert type="success">
  <strong>Well done!</strong> You successfully read this important alert message.
</alert>

以下Component的代码：

import { Component } from '@angular/core';

@Component({
  selector: 'demo-alert-basic',
  templateUrl: './basic.html'
})
export class DemoAlertBasicComponent {}

Answer 2

如何使用ngx-bootstrap创建公共通知，如烤箱通知

Angular 2 Toasty组件显示应用程序的咆哮风格警报和消息在线演示提供here。

只需安装它就像任何其他npm包一样：
npm install ng2-toasty --save
如果您正在使用SystemJS加载文件，请更新配置文件：

System.config({ map: { 'ng2-toasty': 'node_modules/ng2-toasty/bundles/index.umd.js' } });

Answer 3

您可以使用 Angular2 Toasty

Angular2 Toasty组件显示应用程序的咆哮风格警报和消息。

npm install ng2-toasty --save

要知道如何使用它，请参阅https://github.com/akserg/ng2-toasty/blob/master/README.md

在此处查找演示 https://akserg.github.io/ng2-toasty/

如果您使用的是Ionic Framework，则可以使用Ionic ToastController

Answer 4

您可以使用： - ng2-toastr。

这是一款非常简单的烤面包机，可显示成功，错误，警告，信息和定制烤面包机。请检查这个烤面包机。希望这款烤面包机能满足您的要求。

Github链接： - ng2-toastr

这与angular2和4版本兼容。

Answer 5

使用ng2-notifications它提供推送和Toast通知这里是github链接你可以得到详细信息

npm install ng2-notifications --save

https://github.com/alexcastillo/ng2-notifications

Answer 6

您可以在npm上尝试 ngx-notification 。与Angular 6配合使用，安装灵活且简单。

以下是链接：ngx-notification

希望它有所帮助。

如何使用像烤面包机通知的ngx-bootstrap创建公共通知

6 个答案: