● angularでObservable を返す

普通のメソッド

protected myFunction(): boolean {
    return true;
}

　　↓　Observable を返すようにします

Observable を返すメソッド

import { forkJoin, timer, of, Observable } from 'rxjs';

/**
 * @returns Observable
 */
protected myFunction(): Observable<boolean> {
    return of(true);
}

呼び方

this.myFunction.subscribe(
  data => ..., // Promise.then
  err => ..., // Promise.catch
  () => ... // 終了時常に実行
);

● Subscriptionのかわりに Observable を返す

引用 : https://bit.ly/2K1RDFo

of(123456) で 値: 123456 を返す場合

/**
 * @returns Observable
 */
  protected myFunction(): Observable<any> {
    return of(123456).pipe(
      map((res: any) => {
        console.log("■ next ■")
        return res;
      }),
      catchError(err => {
        console.log('■ catchError 1 ■ caught mapping error and rethrowing', err);
        return throwError(err);
      }),
      finalize(() => {
        console.log("■ finalize ■")
      }),
      catchError(err => {
        console.log('■ catchError 2 ■caught rethrown error, providing fallback value');
        return of([]);
      }),
    );
}

結果（正常時）

■ next ■
■ finalize ■

ErrorObservable.create('error') でテスト的にエラーを発生させる場合

import { ErrorObservable } from 'rxjs/observable/ErrorObservable';

/**
 * @returns Observable
 */
  protected myFunction(): Observable<any> {
    // エラーを発生させます
    return ErrorObservable.create('error').pipe(
      map((res: any) => {
        console.log("■ next ■")
        return res;
      }),
      catchError(err => {
        console.log('■ catchError 1 ■ caught mapping error and rethrowing', err);
        return throwError(err);
      }),
      finalize(() => {
        console.log("■ finalize ■")
      }),
      catchError(err => {
        console.log('■ catchError 2 ■caught rethrown error, providing fallback value');
        return of([]);
      }),
    );
}

結果（エラー時）

■ catchError 1 ■ caught mapping error and rethrowing error
■ catchError 2 ■caught rethrown error, providing fallback value
■ finalize ■