Capture d'erreur combinée de tuyau de locative rxjs opérateurs

Nous avons juste mis à niveau à l'une de nos applications Angulaire 5, et a commencé à faire la transition vers des locative opérateurs introduit dans rxjs v5.5.

De ce fait, nous avons réécrit notre observables des pipelines pour la nouvelle syntaxe avec le .pipe() opérateur.

Notre précédent code devrait ressembler à ceci, avec un .catch() à l'intérieur de la .switchMap() pour ne pas interrompre l'exécution d'effets si une erreur est renvoyée.

@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();
  });
  );

Dans le cas d'une erreur renvoyé par l'appel à la dataService il serait pris et traités (simplifié la gestion des erreurs ici).

Avec la nouvelle syntaxe et l'utilisation de .pipe(), nous avons maintenant ce

@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);
    }
  })
  );

Comment puis-je dans un mode similaire à attraper n'importe quel jeté les erreurs dans le observables pipeline, à l'aide de la nouvelle syntaxe?

Après refactoring vous avez déplacé map de switchMap de projection, de sorte que toute erreur de fermer l'extérieur de flux. Quelque chose comme: switchMap(([payload, cultureCode]) => this.dataService.loadData(payload, cultureCode).pipe(map..., catch...)) devrait faire le travail.
Fonctionne très bien @arturgrzesiak! Poster une réponse et je vais l'accepter! 🙂

OriginalL'auteur Daniel B | 2017-11-15