リゾルバとは何ですか？

ルートが実際にアクティブ化される前に、特定のデータがAPIレスポンスからロードされるようにするために、ルートリゾルバを使用します。

つまり、コンポーネントがロードされる前に、特定のルートのデータをプリフェッチします。

なぜリゾルバを使用するのですか？

Angularアプリケーションでは、コンポーネント内でいくつかの要素が自発的に表示されますが、Observableが正常にサブスクライブされた後に他のコンポーネントがロードされ、UI上でレンダリングするのに時間がかかる場合があると仮定します。 ここでは、リゾルバが救助に来ます。 コンポーネントがロードされる前に、アプリケーションがAPIレスポンスから最初にデータを取得することができ、ルートナビゲーションが可能になります。

リゾルバの実装を始めましょう。あなたも好きかもしれません：Angular ObservablesとPromises–それらの使用方法。

リゾルバーサービスの作成

• @angular/routerからResolveインターフェイスをインポートします。
• Resolve()ActivatedRouteSnapshotRouterStateSnapshot以下のように：

• Resolve()メソッドは、オブザーバブルを解決します:

ルートにリゾルバを追加する

リゾルバ、employeeを追加しています。解決します。ルート内のts、およびリゾルバに追加されたresolveメソッドは、解決されたデータをempDataという名前のキーに返します。/p>

EmployeeDetailsComponentで解決されたデータにアクセスする

解決されたデータには、ActivatedRouteのsnapshotオブジェクトを使用してルートで定義されたキーを使用してアクセスできます。p>

HTMLで解決されたデータを表示する

そして、それはリゾルバがどのように動作するかです—ルータが動作を開始し、コンポーネントがロードされる前に、あなたのデータを利用可能にします！

幸せな読書！

さらに読む

• 角度8：あなたが知る必要があるすべて。
• Angular8とWeb APIを使用したフルスタックアプリ：パート1。
• Angular8を使用してFacebookとGoogleでログインします。