Angular2：res.json 不是函数答案

【问题标题】：Angular2: res.json is not a functionAngular2：res.json 不是函数
【发布时间】：2016-08-26 08:43:52
【问题描述】：

我正在尝试在我的代码中使用以下服务：

import {Injectable} from '@angular/core';
import {Http,Response} from "@angular/http";
import 'rxjs/Rx';

@Injectable()
export class HttpService{
    constructor(private http : Http){}

    getData(){
      return  this.http.get("URI")
      .map( (res: Response) => res.json()  );
    }
}

问题是，在运行时它会抱怨：

res.json is not a function

我已经将res的数据类型定义为Response，但还是报错

.map( (res: Response) => res.json()  )

如果我用订阅替换地图，它工作正常：

.subscribe( res =>{
                res.json();
                console.log("City is:"+ res.json().city.name)
            });

【问题讨论】：

您确定您的请求返回的是 json 吗？
当我有 functionA() 调用 functionB() 并且都使用了对 map() 的调用时，我遇到了这个问题。到调用 functionA map() 时，B 的 map 已经将 res.json() 转换为对象数组，这意味着 A 没有可用的 json。修复是从 functionB() 中删除 map() 调用，因此只调用了顶层 map()

标签： angular

【解决方案1】：

对于它的价值，在 Angular 5 中，我发现如果响应是纯 json，则只需返回 res 即可修复 res.json is not a function 错误。

【讨论】：

你节省了我很多时间！！

【解决方案2】：

尝试使用import 'rxjs/add/operator/map'; 而不是import 'rxjs/Rx';。这应该可以解决问题。

【讨论】：

除非结果不是正确的JSON，否则我相信Stefan是对的。
虽然这段代码可能有助于解决问题，但它并没有解释为什么和/或如何回答问题。提供这种额外的背景将显着提高其长期教育价值。请edit您的答案添加解释，包括适用的限制和假设。
@TobySpeight 如果我有解释，你不认为我会提供吗？几天前我遇到了同样的问题，这就是我解决它的方法。我想不出任何import 'rxjs/Rx' 不起作用的原因，因为在Rx.js 文件中存在对rxjs/add/operator/map 的引用，所以我猜这是某种错误，但我不是100% 确定，所以我根本没提，只是想解决这个问题。

【解决方案3】：

你不需要使用这个： .map((res: Response) => res.json() ); 或者 .map(res => res.json()); 因为HttpClient.get() 自动提供或应用于res.json() 并返回Observable<HttpResponse<string>>。

您不再需要自己再次调用此函数。就这么简单的说吧：.map(res => res );这个解决或者解决问题。

【讨论】：

【解决方案4】：

如果您的响应已经是 Json，则无需调用 res.json()，您可以直接使用 res，在这种情况下，您甚至不需要使用 map

  getData(){
  return  this.http.get("URI");
}

【讨论】：

【解决方案5】：

尽量只这样放

.map((response: Response) => response)

这肯定适用于 Angular

【讨论】：