首页 文章

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

提问于
浏览
11

这个问题在这里已有答案:

I've looked up all the github issues, and the StackOverflow posts, but I'm unable to get it working

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();
      })

2 回答

  • 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的错误 .

    Edit

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

    希望它对你有帮助,蒂埃里

  • 7

    对我来说 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

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

相关问题