This question already has an answer here:
这个问题已经有了答案:
- Error : .map() is not a function [duplicate] 2 answers
- 错误:.map()不是一个函数[duplicate] 2的答案
I've looked up all the github issues, and the * posts, but I'm unable to get it working
我查阅了所有github的问题,以及*的帖子,但是我无法让它工作。
( https://github.com/angular/angular/issues/5632 )
(https://github.com/angular/angular/issues/5632)
(Angular 2 HTTP GET with TypeScript error http.get(...).map is not a function in [null] )
(角2 HTTP GET与打字稿错误HTTP . GET(…)。map不是[null]中的函数)
- I'm using Angular2@2.0.0-beta.1
- 我用Angular2@2.0.0-beta.1
- Rxjs (rxjs@5.0.0-beta.1) is successfully imported when I check console/resources in console.
- Rxjs (rxjs@5.0 -beta.1)在检查控制台/资源时成功导入。
I tried different imports:
我试着不同的进口:
import 'rxjs/add/operator/map';
导入“rxjs /添加/运营商/地图”;
import 'rxjs/rx';
进口“rxjs / rx”;
But I keep getting the error http.post(...).map is not a function
但是我一直在获取错误http.post(…)。map不是函数
update - code context
更新,代码上下文
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 个解决方案
#1
2
It seems that Angular2 beta.1 requires RxJS 5.0.0-beta.0. Perhaps it's the cause of your problem.
看起来是Angular2贝塔。1需要RxJS 5.0.0-beta.0。也许这就是你的问题所在。
If I try this in my package
.json file:
如果我在包裹里尝试一下。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"
},
And I have the error that Angular2 requires RxJS 5.0.0-beta.0.
我有一个错误,Angular2需要RxJS 5。0。0。
Edit
编辑
You need to add the HTTP_PROVIDERS
within the second parameter of your bootstrap
function.
您需要在引导函数的第二个参数中添加http_provider。
Hope it helps you, Thierry
希望它能帮助你,蒂埃里
#2
6
For me the http.post(...).map()
works as expected. I do need the import 'rxjs/Rx'
对于我来说,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)
);
}
}
See plunker example: http://plnkr.co/edit/vise2zYxZUmr1kW65mNY?p=preview
恰好看到示例:http://plnkr.co/edit/vise2zYxZUmr1kW65mNY?p=preview
hopes this will help you to find your porblem
希望这能帮助你找到你的门廊
#1
2
It seems that Angular2 beta.1 requires RxJS 5.0.0-beta.0. Perhaps it's the cause of your problem.
看起来是Angular2贝塔。1需要RxJS 5.0.0-beta.0。也许这就是你的问题所在。
If I try this in my package
.json file:
如果我在包裹里尝试一下。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"
},
And I have the error that Angular2 requires RxJS 5.0.0-beta.0.
我有一个错误,Angular2需要RxJS 5。0。0。
Edit
编辑
You need to add the HTTP_PROVIDERS
within the second parameter of your bootstrap
function.
您需要在引导函数的第二个参数中添加http_provider。
Hope it helps you, Thierry
希望它能帮助你,蒂埃里
#2
6
For me the http.post(...).map()
works as expected. I do need the import 'rxjs/Rx'
对于我来说,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)
);
}
}
See plunker example: http://plnkr.co/edit/vise2zYxZUmr1kW65mNY?p=preview
恰好看到示例:http://plnkr.co/edit/vise2zYxZUmr1kW65mNY?p=preview
hopes this will help you to find your porblem
希望这能帮助你找到你的门廊