web-dev-qa-db-fra.com

L'observation .catch n'est pas une fonction

J'obtiens cette erreur très ennuyeuse lors de l'exécution de mon code à partir d'un environnement Unix. Cela fonctionne très bien lorsque j'exécute le code localement via ng serve, Mais lorsque je déploie le code sur mon serveur, cette erreur arrête l'exécution de tout le programme:

ERROR TypeError: this.http.get(...).catch is not a function

Les résultats de Google indiquent que je dois importer les espaces de noms rxjs directement à partir de leur emplacement, et non via le bundle rxjs/Rx, mais je reçois cette erreur malgré tout. D'autres résultats indiquent que j'ai peut-être manqué d'importer des opérateurs rxjs, mais ils sont définitivement inclus dans mon cas.

J'ai même vérifié les sourcemaps inclus à l'aide de DevTools, et les opérateurs sont inclus dans le navigateur.

Quelqu'un peut-il me dire pourquoi j'obtiens cette erreur? J'utilise rxjs: ^ 5.5.2

Ceci est mon code.

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/throw';

@Injectable()
export class MyService {
  constructor(private http: HttpClient) {}

  all(): Observable<any> {
    return this.http.get<any>('url')
      .catch(err => this.handleError(err));
  }
  handleError(error) {
    return Observable.throw(error);
  }
}

MODIFIER Sur la base du commentaire de @ Jota.Toledo ci-dessous, je fournirai le code en utilisant cette méthode:

this.myService.all().subscribe(
  result => {
    this.isLoading = false;
    if (result) {
      this.clients = result;
    }
  },
  error => this.isLoading = false
);

Est-ce que donner deux fonctions de rappel dans subscribe est le même que "utiliser la méthode catch quelque part avant d'ajouter l'opérateur"?

9
Øystein Amundsen

Dans rxjs 5.5.2 vous pouvez résoudre ce problème en utilisant l'opérateur lettable, dans ce cas, catchError. Vous devez l'importer depuis operators comme: import { catchError } from 'rxjs/operators/catchError';. En général, tous les opérateurs doivent être importés de cette façon, la même chose vaut pour observable comme observable/of.

import { catchError } from 'rxjs/operators/catchError';
import { map } from 'rxjs/operators/map';

all(): Observable<any> {
  return this.http.get<any>('url')
    .pipe(
        map(() => //do stuff),
        catchError((error: Error) => {
         //
        })
    )
}

En savoir plus sur les opérateurs locables ici .

12
AndreaM16