web-dev-qa-db-ja.com

lettable rxjsオペレーターの結合パイプでエラーをキャッチ

アプリケーションの1つをAngular 5にアップグレードし、rxjs v5.5で導入された lettable operator への移行を開始しました。

このため、.pipe()演算子を使用して、監視可能なパイプラインを新しい構文に書き換えました。

以前のコードは、.catch()内に.switchMap()があり、エラーがスローされた場合にエフェクトの実行を中断しないようになります。

@Effect()
loadData$ = this.actions$
.ofType(LOAD_DATA)
.map((action: LoadData) => action.payload)
.withLatestFrom(this.store.select(getCultureCode))
.switchMap(([payload, cultureCode]) => this.dataService.loadData(payload, cultureCode)
  .map(result => {
    if (!result) {
      return new LoadDataFailed('Could not fetch data!');
    } else {
      return new LoadDataSuccessful(result);
    }
  })
  .catch((err, caught) => {
    return Observable.empty();
  });
  );

dataServiceの呼び出しでエラーがスローされた場合、キャッチされて処理されます（ここでのエラー処理が簡略化されます）。

新しい構文と.pipe()の使用により、次のようになりました。

@Effect()
loadData$ = this.actions$
.ofType(LOAD_DATA)
.pipe(
  map((action: LoadData) => action.payload),
  withLatestFrom(this.store.select(getCultureCode)),
  switchMap(([payload, cultureCode]) => this.dataService.loadData(payload, cultureCode)),
  map(result => {
    if (!result) {
      return new LoadDataFailed('Could not fetch data!');
    } else {
      return new LoadDataSuccessful(result);
    }
  })
  );

新しい構文を使用して、監視可能なパイプラインでスローされたエラーを同様の方法でキャッチするにはどうすればよいですか？

angularrxjsngrx-storengrx-effectsangular5
25
Daniel B

リファクタリング後、mapをswitchMapプロジェクションから移動したため、エラーが発生すると外部ストリームが閉じられます。両方のストリームを同等に保つには、プロジェクション自体でpipeを次のように使用する必要があります。

import { empty } from 'rxjs;

// ...

@Effect()
loadData$ = this.actions$
.ofType(LOAD_DATA)
.pipe(
  map((action: LoadData) => action.payload),
  withLatestFrom(this.store.select(getCultureCode)),
  switchMap(([payload, cultureCode]) =>
    this.dataService.loadData(payload, cultureCode)
      .pipe(
         map(result => {
           if (!result) {
             return new LoadDataFailed('Could not fetch data!');
           } else {
             return new LoadDataSuccessful(result);
           }
          }),
         catchError((err, caught) => {
           return empty();
         })
      )
  )
);
37
artur grzesiak