HTTP

Angular の HTTP クラスを使うとバックエンドのサーバーに接続して非同期で情報を取得したり、 サーバー内で情報を更新したりすることができます。

HTTP クラスのメソッドは Observable を返します。 Observable は非同期データを扱うための仕組みで、イベントストリームを表します。

Observable をそのまま使った方が良いこともあれば、次に紹介するように Promise に変換した方が良い場合もあります。

Promise に変換すれば、then と catch で継ぐだけなので簡単ですよね。

まずは、Promise に変換するのが適した「まとまった情報を取得してハイ終了」というシナリオを用いた例を示します。次の例ではサービスプロバイダとなるクラスでは、 Promise を返します。

HTTP を用いて非同期で情報を取得する例

HTTP を用いて非同期で情報を取得する単純な例

Observable をそのまま使うのが適しているのは、例えばテキストボックスに次々と文字を打ち込むのに応答する場合等、 次々とイベントを発生させるような場合です。このときは、Subject の next メソッドで用いてオブザーバブルのイベントストリームを作ることもできます。

あるいは、FormControl を使って Observable を返す valueChanges でフィルターをかけるなどして、 実効的なイベントを減らすこともあります。

次の例は FormControl でイベントのフィルタを行い、また、サービス側で Observable を返す例です。

HTTP を用いて非同期で情報を取得する例 (2)