角度5，rxjs映射到json，类型“ object”上不存在“ json”

Question

Trying to follow an online video, then this appears, I am new to angular, other solutions are not helping me out.

import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import 'rxjs/add/operator/map';

/*
  Generated class for the WeatherProvider provider.

  See https://angular.io/guide/dependency-injection for more info on providers
  and Angular DI.
*/
@Injectable()
export class WeatherProvider {
  apikey='7d2dc7a226a78c14';
  url;

  constructor(public http: HttpClient) {
    console.log('Hello WeatherProvider Provider');
    this.url='http://api.wunderground.com/api/'+this.apikey+'/conditions/q'
  }

    getWeather(city,state){
      return this.http.get(this.url+'/'+state+'/'+city+'.json')
        .map(res => res.json() );      
    }
}

Answer 1

If you're using the new HttpClient you don't need to parse JSON because it's decoded automatically for you:

https://angular.io/guide/http#type-checking-the-response

The HttpClient.get() method parsed the JSON server response into the anonymous Object type. It doesn't know what the shape of that object is.

Also https://angular.io/guide/http#requesting-non-json-data .

Answer 2

With angular 5 and httpClient , you don't need to use the map part anymore.

Read more here: https://angular.io/guide/http#type-checking-the-response

getWeather(city,state){
  return this.http.get(this.url+'/'+state+'/'+city+'.json');     
}

If you want to get data in specific format, You can tell HttpClient the type of the response to make consuming the output easier and more obvious.

export interface Config {
 heroesUrl: string;
 textfile: string;
}

And then :

getConfig() {
  // now returns an Observable of Config
  return this.http.get<Config>(this.configUrl);
}