Question

尝试从Angular 2调用一个返回单个Json对象的Web服务：

{
   "fullDisplayName": "test",
   "result": "SUCCESS"
}

以下是我的路线的代码段：

服务

getJsonObject () {
    return this.http.get(this.url)
                    .map(res => <jsonObject> res.json())
                    .do(jsonObject=> console.log(jsonObject))
                    .catch(this.handleError);
}

组件

getJsonObject() {
   console.log('BEFORE')
   this.service.getJsonObject()
      .subscribe(
          jsonObject=> this.jsonObject = jsonObject,
          error =>  this.errorMessage = <any>error);
          console.log(this.jsonObject)
          console.log("AFTER")
 }

我得到的只是一个未定义的对象，但我可以在控制台日志中看到Chrome中的JSON。有趣的是我在调用之前和之后在组件中放置了一个日志，这两个日志都显示在日志中显示的JSON之前，使得它看起来像是在Web服务返回数据之前尝试映射对象。

控制台日志

 Angular 2 is running in the development mode. Call enableProdMode() to enable the production mode.
 BEFORE
 undefined
 AFTER
 Object {fullDisplayName: "test", result: "SUCCESS"}

非常感谢任何帮助。

Answer 1

     console.log(this.jsonObject)
     console.log("AFTER")

在将this.url的请求发送到服务器之前执行

。 Observable是异步的，执行被排入事件队列，当响应到达时，传递给subscribe(...)的回调被执行。

这是您实际需要做的事情：

getJsonObject() {
   console.log('BEFORE')
   this.service.getJsonObject()
      .subscribe(
          jsonObject=> {
              this.jsonObject = jsonObject,
              console.log(this.jsonObject)
              console.log("AFTER")
          },
          error =>  this.errorMessage = <any>error);
 }

如何调用在Angular 2中返回单个JSON对象的Web服务？

1 个答案: