1. ホーム
  2. javascript

[解決済み] 最もエレガントな方法でポップアップを表示する

2022-04-21 06:50:46

質問

私はこのAngularJSのアプリを持っています。すべてうまく動作しています。

今、私は特定の条件が真になったときに異なるポップアップを表示する必要があり、それを進めるための最良の方法は何だろうと考えていました。

現在、2つの選択肢を評価していますが、他の選択肢も絶対に受け入れるつもりです。


オプション1

ポップアップ用の新しいHTML要素を作成し、コントローラから直接DOMに追加することができます。

これでは、MVCデザインパターンが崩れてしまいます。私はこの解決策に満足していません。


オプション2

すべてのポップアップのコードを静的なHTMLファイルに挿入することはいつでもできます。そして ngShow 正しいポップアップだけを表示/非表示にすることができます。

このオプションは、拡張性がありません。


だから、私が望むことを実現するためには、もっと良い方法があるはずなんです。

どのように解決するのですか?

AngularJS モーダルに関するこれまでの経験から、最もエレガントなアプローチは、モーダルに表示する部分的な (HTML) テンプレートを提供できる専用のサービスだと考えています。

モーダルは、AngularJSのルーティングのようなものですが、モーダルポップアップで表示されるだけなのです。

AngularUIのブートストラッププロジェクト( http://angular-ui.github.com/bootstrap/ ) には、優れた $modal サービス (バージョン 0.6.0 以前は $dialog と呼ばれていました) を実装しており、パーシャルのコンテンツをモーダルポップアップとして表示するためのサービスです。