web-dev-qa-db-fra.com

Module introuvable: erreur: impossible de résoudre 'rxjs/add/operator/catch' dans 'F:\Angular\HttpServices\http-services\src\app'

Voici mon code. 

import { injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/catch';

@Injectable({
    providedIn: 'root'
})
export class PostsService {
    private url = 'https://jsonplaceholder.typicode.com/posts';
    constructor(private http : Http ) { }
    getPosts {
        return this.http.get(this.url);
    } 

    deletePost(id) {
        return this.http.get(this.url + '/' + id);
    }
}

Je fais ce code sur mon PC, il fonctionne mais ne fonctionne pas sur un ordinateur portable. Cela semble drôle mais c'est vrai.
C'est la structure de mon projet

angularrxjsobservable
7
Ayjaz Sayed

La nouvelle version de rxjs ne prend plus en charge les importations uniques, essayez plutôt:

import { catchError } from 'rxjs/operators';
10
Ivo Bogoevski

Dans Angular 6, les importations RXJS ont été modifiées, les opérateurs doivent être "enveloppés" dans pipe () et écrits sans point au début (était: .map, .retry, .catch; now: map, retry et catchError ):

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

et utilisez pipe ()

getPosts() {
    // pack in "pipe()"
    return this.http.get(this.url).pipe(
      // eg. "map" without a dot before
      map(data => {
        return data;
      }),
      // "catchError" instead "catch"
      catchError(error => {
        return Observable.throw('Something went wrong ;)');
      })
    );
  }

"Je fais ce code sur mon PC, il fonctionne mais ne fonctionne pas sur un ordinateur portable" - sur l'ordinateur portable, vous disposez d'une version plus récente de angular cli. Il génère un angle 6 avec de nouvelles importations. Cordialement

7
brudek

dans angular 7, voici comment gérer de manière propre la requête http get

import {Injectable} from '@angular/core';
import {HttpClient} from '@angular/common/http';
import {Observable, throwError} from 'rxjs';
import {catchError, retry} from 'rxjs/operators';

@Injectable({
  providedIn: 'root'
})
export class EmployeeService {

  constructor(private _http: HttpClient) {
  }

  public getPosts(): Observable<Post[]> {

    return this._http.get(<URL>).pipe(
      retry(1), catchError(error => {
        return throwError(error.message);
      }));
  }
}
1
Toumi
try this and will work!...

    import { Injectable } from '@angular/core';    
import { HttpClient, HttpErrorResponse } from '@angular/common/http';    
import { catchError } from 'rxjs/operators';    
import { Observable, throwError } from 'rxjs';    


    .get(<URL>).pipe
     (
     catchError((error: HttpErrorResponse) =>{       
        return throwError(error.message || 'server error');    
                                            })
     )
0
MoHaMMaD Hedayati