web-dev-qa-db-ja.com

Angular 5つのスナックバーの通知

次のような通知メッセージを実装したい

"Success! Your Details Added"
"Warning! Something Went Wrong"
"Danger! You don't have access to this"

すでにangularアプリケーションでマテリアルを使用しています。通知目的で 'snack-bar' を使用できますか?

私はいくつかの関連するものも見つけました npmのトースター

これを行う別の方法があれば教えてください。

9
Developer

angular素材を使用しているので、angular素材のスナックバーを使用する方が良いでしょう。

他のオプションを探したい場合は、 growlof primeng または primengの​​メッセージ

この種のメッセージを表示するためのカスタムコードを記述することもできます。しかし、その場合、そのメッセージの位置、タイミング、却下などの多くのことを外部で制御する必要があります

したがって、選択は絶対にあなた次第です。

6
Ashraful Islam

これを使用します ngx-toastrデモ

  • ViewContainerRefを渡さずにトーストコンポーネントインジェクション
  • * ngForを使用しません。ダーティチェックの削減とパフォーマンスの向上。
  • AoTコンパイルと遅延読み込みの互換性
  • カスタムトーストのコンポーネント継承
  • SystemJS/UMDロールアップバンドル
  • AngularのWeb Animations APIを使用したアニメーション(古いデバイスにはポリフィルが必要)
  • オプションのターゲットディレクティブへのトーストの出力
10
xeofus

通知には、 angular2-notifications を使用できます。

トースターの場合は、 angular2-toaster を使用できます。

5
Zoha Irshad