Angular/HttpClientのObservable

HttpClientのメソッドから返されるHTTPレスポンス

  /** DELETE: サーバーからメモを削除 */
 public delMemo(id: any): Observable<any> {
   return this.http.delete(this.host + '/api/..' + id, this.httpOptions);
 }

開始と終了がある非同期処理と1:1で対応します。つまり、 非同期タスクを抽象化するためのObservableです。この特徴は Promise と同じものです。購読に合わせてタスクを開始し、必要な値をストリームに流したあと、タスクの終了をもってObservableが完了します。

Promiseとの相違点は、

・Observableは購読まで実行が遅延される
・Observableは unsubscribe によって中断できる
・Observableは何回でも値を流せる

Router#events 

export class AppComponent {
 constructor(
   private router: Router,
   private viewportScroller: ViewportScroller) {
   //
   this.router.events.pipe(filter(e => e instanceof Scroll))
   .subscribe((e: any) => {
     console.log(e);

     // this is fix for dynamic generated(loaded..?) content
     setTimeout(() => {
       if (e.position) {
         this.viewportScroller.scrollToPosition(e.position);
       } else if (e.anchor) {
         this.viewportScroller.scrollToAnchor(e.anchor);
       } else {
         this.viewportScroller.scrollToPosition([0, 0]);
       }
     });
   });
 }

ここで Router#events プロパティが返しているObservableは、 自動的に完了することのないObservableです。購読者の有無にかかわらず発生するイベントを流し続けます。つまり、 イベントストリームを抽象化するためのObservableです。完了することがないため、 toPromise メソッドが返すPromiseの then コールバックは実行されません。

コールバック

Ｅｎｄ

thanks　by　Angular After Tutorial