web-dev-qa-db-ja.com

トースター通知のようなngx-bootstrapで一般的な通知を作成する方法

angular 2＆4.は初めてです。ngx-bootstrapアラートとモーダルを使用してカスタム通知を作成します。検索していくつかのサンプルを取得しました。しかし、それらは単純ではありません。単純にサービス、インターフェース、コンポーネントで通知を作成するための簡単な青写真。

どなたか、サンプルコードを教えてください。

angularpush-notificationangular2-services
13
Kevin - Dhinesh babu

ngx-bootstrapの公式ドキュメント- アラート 。
ngx-bootstrapの公式ドキュメント- Modals 。
そこで利用可能なAPIのドキュメントと使用シナリオ、および実用的な例。

簡単に参照できるように、簡単なアラートボックスのコードを以下に示します。

まず最初に、以下を使用して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 {}
3
Manubhargav

トースター通知のようなngx-bootstrapで一般的な通知を作成する方法

Angular 2 Toasty コンポーネントは、アプリケーションのうなり声のアラートとメッセージを表示します。
オンラインデモが利用可能 ここ 。

  • 他のnpmパッケージと同じようにインストールしてください：
    _npm install ng2-toasty --save_

  • SystemJSを使用してファイルをロードしている場合は、構成ファイルを更新します。

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

3
Manubhargav

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 を使用できます。

1
Newton Joshua

Npmでngx-notificationを試すことができます。 Angular 6で動作し、柔軟で簡単にインストールできます。

これがリンクです： ngx-notification

それが役に立てば幸い。

1
Craig2018

これを使用できます：- ng2-toastr 。

これは成功、エラー、警告、情報、カスタムトースターを表示する非常にシンプルなトースターです。このトースターを確認してください。このトースターがあなたの要件を完了することを願っています。

Githubリンク：- ng2-toastr

これはangular2および4バージョンと互換性があります。

1
Harleen Kaur Arora

プッシュ通知とトースト通知を提供するng2-notificationsを使用してくださいここにgithubリンクがあり、詳細を取得できます

npm install ng2-notifications --save

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

1
naveen atti