Angular - res json is not a function

Question

I am having an issue with my API Service  This service connects to my nodejs backend api   The error says   ERROR TypeError  res json is not a function   I am getting this error after recently updated this service to use the HTTPClient instead of Http  Im getting this reponse because im missing the old http with the new  if thats the case is there an new Response and how do i use it   import   Injectable   from   angular core   import   environment   from        environments environment   import   HttpHeaders  HttpClient  HttpParams   from   angular common http   import   Response   from   angular http   import   Observable   from  rxjs Rx   import  rxjs add operator map   import  rxjs add operator catch    import   JwtService   from    jwt service     Injectable   export class ApiService     constructor      private http  HttpClient      private jwtService  JwtService           private setHeaders    HttpHeaders       const headersConfig            Content-Type    application json          Accept    application json             if  this jwtService getToken            headersConfig  Authorization     this jwtService getToken              return new HttpHeaders headersConfig          private formatErrors error  any         return Observable throw error json            get path  string  httpParams  HttpParams   new HttpParams     Observable lt any gt        return this http get    environment api url   path      headers  this setHeaders    params  httpParams         catch this formatErrors       map  res  Response    gt  res json            put path  string  body  Object        Observable lt any gt        return this http put           environment api url   path          JSON stringify body           headers  this setHeaders                catch this formatErrors       map  res  Response    gt  res json            post path  string  body  Object        Observable lt any gt        return this http post           environment api url   path          body          headers  this setHeaders                catch this formatErrors       map  res  Response    gt  res json            delete path   Observable lt any gt        return this http delete           environment api url   path            headers  this setHeaders                catch this formatErrors       map  res  Response    gt  res json

User · Answer

Had a similar problem where we wanted to update from deprecated Http module to HttpClient in Angular 7. But the application is large and need to change res.json() in a lot of places. So I did this to have the new module with back support.

return this.http.get(this.BASE_URL + url)
      .toPromise()
      .then(data=>{
        let res = {'results': JSON.stringify(data),
        'json': ()=>{return data;}
      };
       return res; 
      })
      .catch(error => {
        return Promise.reject(error);
      });

Adding a dummy "json" named function from the central place so that all other services can still execute successfully before updating them to accommodate a new way of response handling i.e. without "json" function.

User · Answer

HttpClient get   applies res json   automatically and returns Observable lt HttpResponse lt string gt  gt   You no longer need to call this function yourself   See Difference between HTTP and HTTPClient in angular 4

User · Answer

You can remove the entire line below     map  res  Response    gt  res json       No need to use the map method at all

User · Answer

Don t need to use this method     map  res  Response    gt  res json        Just use this simple method instead of the previous method  hopefully you ll get your result    map res   gt  res

[angular] Angular - res.json() is not a function

Examples related to angular