Emberの新機能です。ユーザーが「サーバーからアイテムを取得」ボタンを押すと、フルスクリーンオーバーレイを表示したいと考えています。Ember JS全画面表示のロードボタンを表示する最善の方法
これを達成する最も良い方法は何ですか？
すでにEmberには何かが組み込まれていますか？それとも、唯一の方法は、AJAX呼び出しを返す場所を約束したときに表示/非表示にするために、私のテンプレートの1つにHTMLを入れることです。
ご利用いただけるオプションはいくつかあります。
最初はルート変更に関係します。従来、ユーザーが別のルートに移動するボタンを押すと、a separate route can be created to handle this in-between loading experienceが発生しました。
あなたが関連するテンプレートとfoo-loadingという名前の兄弟ルートを作成し、fooという名前のルートを持っている場合は、物事がフェッチされている間、「FOO-ロード」ページの状態を示し、その後、物事たら、それを閉じますが、この簡潔に記述するために良いです。
また、ユーザーの行動を促すフレーズが同じルート上の更新された結果を意図している場合は、ローディングサービスが役立つ可能性があります。アプリケーションテンプレートでは、デフォルトで非表示になっている読み込みdivを持つことができます。 AJAXリクエストを開始する前に、ロード状態をオンにしてロードdivを表示することができます。その後、AJAXコールが決着すると、finallyブロックにローディングdivを隠すための呼び出しが含まれる可能性があります。
この後者のアプローチでは、プライマリアプリケーションテンプレートに条件付きでロードされたブロック、表示サービスと表示を非表示にするロードサービス、および読み込みテンプレートが含まれます。
ember-modal-dialogを使用すると、ajaxリクエストを待機しているときにレンダリングされる読み込み画面コンポーネントを作成できます。
例えば：
// view.js
showLoadingScreen: true
// view.html
{{#if showLoadingScreen}}
{{loading-screen}}
{{/if}}
// loading-screen.html
{{#ember-modal-dialog}}
<div class="loader-full-screen-class"></div>
{{/modal-dialog}}
成分/燃えさしモーダル・ダイアログの利点は、このパターンは、通常モーダルとして実装されることがあり、このライブラリーは、燃えさしで標準です。コンポーネントを使用すると、必要な場所に配置することができます。