2015-12-22 6 views
4

Я пытаюсь получить данные с url с помощью функции http.post. Но я получаю ошибки. Исходный код app.component.ts файла:Ошибка Http.post: карта не является функцией в Angular 2

import {Component} from 'angular2/core'; 
import {bootstrap} from 'angular2/platform/browser'; 
import {Http, HTTP_PROVIDERS, Headers} from 'angular2/http'; 
@Component({ 
selector: 'my-app', 
template: ` 
<div> 
    <button (click)="postData()">Post Data</button> 
    <p>Posted the following values:</p> 
    <div>{{postResponse.id}}</div> 
    <div>{{postResponse.name}}</div> 
</div>` 
}) 
export class AppComponent { 
result: Object; 
http: Http; 
postResponse = new Person(); 

constructor(http: Http) { 
    this.http = http; 
} 

postData(){ 
    var headers = new Headers(); 
    headers.append('Content-Type', 'application/json'); 

    this.http.post('http://141.79.39.454:8008/the-link-something-like-this...', JSON.stringify({"id": 1, "name": "Новые"}),{headers:headers}) 
    .map(res => res.json()) 
    .subscribe((res:Person) => this.postResponse = res); 
} 
} 

class Person{ 
id:number; 
name:string; 
} 

bootstrap(AppComponent, [HTTP_PROVIDERS]); 

JSON в URL выглядит this. Когда я нажимаю кнопку, я получаю ошибки выглядеть следующим образом:

EXCEPTION: Error during evaluation of "click" 
Uncaught EXCEPTION: Error during evaluation of "click" 
ORIGINAL EXCEPTION: TypeError: this.http.post(...).map is not a function 
ORIGINAL STACKTRACE: 
TypeError: this.http.post(...).map is not a function 
at AppComponent.postData (http://localhost:3000/app/app.component.js:35:26) 
at AbstractChangeDetector.ChangeDetector_AppComponent_0.handleEventInternal (eval at <anonymous> (http://localhost:3000/node_modules/angular2/bundles/angular2.dev.js:10897:14), <anonymous>:124:33) 
at AbstractChangeDetector.handleEvent (http://localhost:3000/node_modules/angular2/bundles/angular2.dev.js:8788:22) 
at AppView.dispatchEvent (http://localhost:3000/node_modules/angular2/bundles/angular2.dev.js:9396:39) 
at AppView.dispatchRenderEvent (http://localhost:3000/node_modules/angular2/bundles/angular2.dev.js:9391:19) 
at DefaultRenderView.dispatchRenderEvent (http://localhost:3000/node_modules/angular2/bundles/angular2.dev.js:7819:53) 
at eventDispatcher (http://localhost:3000/node_modules/angular2/bundles/angular2.dev.js:9781:19) 
at http://localhost:3000/node_modules/angular2/bundles/angular2.dev.js:9852:14 
at http://localhost:3000/node_modules/angular2/bundles/angular2.dev.js:15370:34 
at http://localhost:3000/node_modules/angular2/bundles/angular2.dev.js:7874:18 
ERROR CONTEXT: 
[object Object]run @ angular2-polyfills.js:143zoneBoundFn @ angular2-polyfills.js:111 
+0

Сообщение трассировке стеки как текст, в этом вопросе, а не ссылка на изображение. –

+0

Не могли бы вы посмотреть на это? –

+0

Я думаю, вы просто используете старую версию Angular2. Обновите последнюю бета-версию. –

ответ

11

Возможно, вам можно попробовать добавить следующее в вашем импорте:

import 'rxjs/add/operator/map'; 

Смотрите этот вопрос для более подробной информации: https://github.com/angular/angular/issues/5632.

Надеется, что это помогает вам, Тьерри

+0

О, ошибки исчезли!) Но теперь он не показывает результаты запроса. Может ли это быть связано с заголовком или JSON.stringify? –

+0

Ключ должен состоять в том, чтобы взглянуть на вкладку «Сеть» в инструментах Chrome dev, например, чтобы увидеть, выполняется ли запрос и что ответ существует ... –

+0

Желаю, чтобы я мог увеличить это вдвое – Tucker

Смежные вопросы