Angular2 - http.post(...).map 不是一个函数[重复]答案

【问题标题】：Angular2 - http.post(...).map is not a function [duplicate]Angular2 - http.post(...).map 不是一个函数[重复]
【发布时间】：2016-05-01 12:16:07
【问题描述】：

我查看了所有 github 问题和 StackOverflow 帖子，但无法正常工作

(https://github.com/angular/angular/issues/5632)

(Angular 2 HTTP GET with TypeScript error http.get(...).map is not a function in [null])

我正在使用 Angular2@2.0.0-beta.1
当我在控制台中检查控制台/资源时，Rxjs (rxjs@5.0.0-beta.1) 已成功导入。

我尝试了不同的导入：

import 'rxjs/add/operator/map';

import 'rxjs/rx';

但我不断收到错误消息 http.post(...).map is not a function

更新 - 代码上下文

let body = "email=" + email + "&password=" + password;
let headers = new Headers();
headers.append('Content-Type', 'application/x-www-from-urlencoded');
this.http.post('http://angular.app/api/v1/auth') // angular.app is laravel backend
      .map( (responseData) => {
          return responseData.json();
      })

【问题讨论】：

您能否提供更多有关您的 HTTP 调用代码的详细信息？谢谢！
@ThierryTemplier 查看我的更新
谢谢！调用bootstrap 函数时是否添加HTTP_PROVIDERS？
@ThierryTemplier 我没有！它确实改变了一些东西，因为现在我得到另一个错误：ReferenceError: map is not defined 但我确实在每个文件中导入了rxjs/add/operator/map（甚至在我的主文件中）
@ThierryTemplier 以上是问题所在（我需要添加 HTTP_PROVIDERS）。我有另一个错误导致上述错误。（语法问题，我的错）。您可以将此作为答案发布，以便我接受吗？

标签： angular rxjs

【解决方案1】：

对我来说，http.post(...).map() 按预期工作。我确实需要导入 'rxjs/Rx'

import {Component} from 'angular2/core';
import {Http} from 'angular2/http';
import 'rxjs/Rx';
@Component({
  selector: 'my-app',
  template: `
    <h1>{{title}}</h1>
    <p>Test result {{result | json}}</p>
    `
})
export class App implements OnInit{
 public title = 'my title';
 public result : String;

constructor(private _http : Http) {
  _http.post('http://jsonplaceholder.typicode.com/posts')
    .map(res => res.json())
    .subscribe(
      data => this.result = data,
      err => console.log('ERROR!!!'),
      () => console.log('Got response from API', this.result)
    );
  }
}

查看 plunker 示例：http://plnkr.co/edit/vise2zYxZUmr1kW65mNY?p=preview

希望这会帮助你找到你的问题

【讨论】：

这对我有用。我在"@angular/core": "^4.0.0","rxjs": "^5.1.0" ... 上遇到了同样的问题

【解决方案2】：

Angular2 beta.1 似乎需要 RxJS 5.0.0-beta.0。也许这就是你的问题的原因。

如果我在我的 package.json 文件中尝试这个：

"dependencies": {
    "angular2": "2.0.0-beta.1",
    "systemjs": "0.19.6",
    "es6-promise": "^3.0.2",
    "es6-shim": "^0.33.3",
    "reflect-metadata": "0.1.2",
    "rxjs": "5.0.0-beta.1",
    "zone.js": "0.5.10"
},

我有错误，Angular2 需要 RxJS 5.0.0-beta.0。

编辑

您需要在bootstrap 函数的第二个参数中添加HTTP_PROVIDERS。

希望对你有帮助蒂埃里

【讨论】：

我尝试了 beta.0，仍然没有运气，我得到了同样的错误 (ReferenceError: map is not defined)
@AngeloA 你试过：import 'rxjs/Rx';（Rx 不是rx）？
是的，（大写的 R）
这真的很奇怪。你有可能创建一个 plunkr 来重现这个吗？谢谢！这是一个描述有效 HTTP 示例的示例：plnkr.co/edit/XFmSGw4etdGvvPNkJxkI?p=preview.
尽管添加了导入，但我遇到了同样的问题，@AngeloA 你能解决这个问题吗？我正在使用“@angular/common”：“2.0.0-rc.5”和“rxjs”：“5.0.0-beta.6”