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

Question

嘗試觀看在線視頻，然后出現，這對我是陌生的，其他解決方案也無濟於事。

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

如果您使用的是新的HttpClient ，則無需解析JSON，因為它會自動為您解碼：

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

HttpClient.get()方法將JSON服務器響應解析為匿名Object類型。 它不知道該對象的形狀是什么。

也是https://angular.io/guide/http#requesting-non-json-data 。

Answer 2

使用angular 5和httpClient ，您不再需要使用map部件。

在此處了解更多信息： https : //angular.io/guide/http#type-checking-the-response

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

如果要獲取特定格式的數據，則可以告訴HttpClient響應的類型，以使輸出的使用更加容易和明顯。

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

接着 ：

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