Angular2 - http.post(...).map is not a function
Solution 1
It seems that Angular2 beta.1 requires RxJS 5.0.0-beta.0. Perhaps it's the cause of your problem.
If I try this in my package
.json file:
"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.
Edit
You need to add the HTTP_PROVIDERS
within the second parameter of your bootstrap
function.
Hope it helps you, Thierry
Solution 2
For me the http.post(...).map()
works as expected.
I do need the import '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
hopes this will help you to find your porblem
Angelo A
Front-End + Back-End Developer Symfony 2 / Laravel / Doctrine / Angular2 (learning) / Backbone (learning)
Updated on July 09, 2022Comments
-
Angelo A almost 2 years
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] )
- I'm using [email protected]
- Rxjs ([email protected]) is successfully imported when I check console/resources in console.
I tried different imports:
import 'rxjs/add/operator/map';
import 'rxjs/rx';
But I keep getting the error
http.post(...).map is not a function
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(); })
-
Angelo A over 8 yearsI tried beta.0, still no luck, I get the same error (
ReferenceError: map is not defined
) -
Thierry Templier over 8 years@AngeloA did you try with:
import 'rxjs/Rx';
(Rx
notrx
)? -
Angelo A over 8 yearsYes I did, (capital R)
-
Thierry Templier over 8 yearsThat's really strange. Would it be possible for you to create a plunkr to reproduce this? Thanks! Here is a one describing a working HTTP sample: plnkr.co/edit/XFmSGw4etdGvvPNkJxkI?p=preview.
-
john mitsch over 7 yearsI'm having the same problem despite adding the imports, @AngeloA were you able to resolve this? I'm using "@angular/common": "2.0.0-rc.5" and "rxjs": "5.0.0-beta.6"
-
Angelo A over 7 years@johnmitsch to be honest I stopped using Angular. It had too much flaws at that point. As far as I can remember, I didn't solve it. You should probably search SO for other posts. I think this must be resolved by now.
-
Dev about 7 yearsThis worked for me. I was having the same problem with
"@angular/core": "^4.0.0","rxjs": "^5.1.0" ...