如何在 Angular2 中进行 HTTP POST 调用并打印响应

Question

我是 Angular2 的新手，正在构建一个示例项目来学习它。我目前正在研究如何在 Angular2 中进行 HTTP 调用，并找到了以下代码 sn-p 示例：

var headers = new Headers();
headers.append('Content-Type', 'application/json');
this.http.post('http://www.syntaxsuccess.com/poc-post/', 
                       JSON.stringify({firstName:'Joe',lastName:'Smith'}),
                       {headers:headers})
.map((res: Response) => res.json())
.subscribe((res:Person) => this.postResponse = res);

我不确定订阅的作用，但我的主要目标是打印响应。从这段代码中我可以看到响应，但我不确定如何“隔离和访问它”（我希望这是有道理的）。我的问题是如何将响应打印到控制台？

Answer 1

我的问题是如何将响应打印到控制台？

你可以打印res:

.subscribe((res:Person) => { this.postResponse = res; console.log(res); });

Click here for demo plunk.

---

我不确定订阅的作用（...）

Http.post(...) (link) 的结果是Observable<Response> (link)。

在您的代码中，您选择 POST 的结果（Observable<Response>）并在其上调用 .map() (link)。在您的情况下，您这样做是为了将响应解析为 JSON 并将其转换为对象：

.map((res: Response) => res.json())

现在，.map() 的结果也是 Observable<Response>。那是你打电话给subscribe的时候。

subscribe() (link) 是Observable (link) 类的一个方法，它通常允许您“注册”或“订阅”三个函数来处理/读取此可观察对象发出的结果（或“事件”） -它们被称为 (on)next、(on)error 和 (on)complete。

所以，使用.subscribe()的代码通常是：

.subscribe(
     (response) => {
            /* this function is executed every time there's a new output */
           console.log("VALUE RECEIVED: "+response);
     },
     (err) => {
            /* this function is executed when there's an ERROR */
            console.log("ERROR: "+err);
     },
     () => {
            /* this function is executed when the observable ends (completes) its stream */
            console.log("COMPLETED");
     }
 );

所以，为了全面了解Angular2的Http，建议大家阅读RxJS and Observables上的一些资源。当你从它那里回来时，事情会简单得多，我保证（不是双关语:)。