【问题标题】:Http.post error: map is not a function in Angular 2Http.post 错误:地图不是 Angular 2 中的函数
【发布时间】:2023-03-20 03:12:01
【问题描述】:

我正在尝试通过 http.post 函数从 url 获取数据。但是我遇到了错误。 app.component.ts文件源码:

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]);

url 中的 JSON 看起来像 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

【问题讨论】:

  • 将堆栈跟踪作为文本发布在问题中,而不是图像链接。
  • 你能看看吗?
  • 我认为您只是在使用旧版本的 Angular2。更新到最新的测试版。
  • 我已经安装了最新的测试版)
  • 那我就不知道了。

标签: angular


【解决方案1】:

也许您可以尝试在导入中添加以下内容:

import 'rxjs/add/operator/map';

更多详情请参阅此问题:https://github.com/angular/angular/issues/5632

希望对你有帮助 蒂埃里

【讨论】:

  • 哦,错误消失了! ) 但现在它不显示请求的结果。是否可以与 header 或 JSON.stringify 连接?
  • 一个线索应该是查看 Chrome 开发工具中的网络选项卡,例如查看请求是否已执行以及响应是否存在...
猜你喜欢
  • 2018-03-10
  • 2018-11-04
  • 2021-10-16
  • 1970-01-01
  • 1970-01-01
  • 2017-05-12
  • 2018-07-01
  • 1970-01-01
  • 2017-05-20
相关资源
最近更新 更多