Question

我正在使用angular2 typeScript从webservice返回json。我可以通过调用get从WebService获取值，但是我无法获取JSON的组件。例如，我想获取返回的JSON的状态。我可以获得整个JSON但不是JSON的确切状态。您可以在下面看到示例代码和webservice返回的JSON。

此致阿尔珀

示例代码：

this.http.get(this.webServiceUrlGet)
  .subscribe(
    function (data) {
      this.tradeShows = JSON.stringify(data);
      console.log(this.tradeShows);

    },
    error => this.errorMessage = <any>error);

    JSON : 
   "_body":"{\n  \"args\": {}, \n  \"headers\": {\n    \"Accept\":      \"application/json, text/plain, */*\", \n    \"Accept-Encoding\": \"gzip, deflate, sdch, br\", \n    \"Accept-Language\": \"tr-TR,tr;q=0.8,en-US;q=0.6,en;q=0.4\", \n    \"Connect-Time\": \"0\", \n    \"Connection\": \"close\", \n    \"Host\": \"httpbin.org\", \n    \"Origin\": \"http://localhost:3000\", \n    \"Referer\": \"http://localhost:3000/navigation\", \n    \"Total-Route-Time\": \"0\", \n    \"User-Agent\": \"Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Mobile Safari/537.36\", \n    \"Via\": \"1.1 vegur\", \n    \"X-Request-Id\": \"db6c93bd-99dd-4410-a709-5bc2dd4150fb\"\n  }, \n  \"origin\": \"212.175.18.38\", \n  \"url\": \"https://httpbin.org/get\"\n}\n","status":200,"ok":true,"statusText":"OK","headers":{"Content-Type":["application/json"]},"type":2,"url":"https://httpbin.org/get"}

Answer 1

这样做：

this.tradeShows = data.json();

订阅时从HTTP调用中返回的对象是Response对象，其中包含有关HTTP调用的所有方面的信息，包括标题，正文等.json（）方法自动获取正文字段并把它变成你可以使用的对象。

顺便说一下，JSON.stringify()接受一个对象并将其转换为字符串。如果您要进行手动JSON解析，则需要使用JSON.parse()。

如果要获取发回的HTTP状态代码，可以在响应的状态属性中访问该状态代码：data.status

Answer 2

如果你想获得状态 AND json，你可以这样做：

this.http.get(this.webServiceUrlGet)
  .map(resp=>[resp.status,resp.json()])
  .subscribe(([status,data]) => {
      this.tradeShows = data;
      this.status = status;
      console.log(this.tradeShows,this.status);
    },
    error => this.errorMessage = <any>error);

您需要致电resp.json()，因为Http服务发送的内容是Response object

Answer 3

使用typescript时，您需要映射值并在组件页面中订阅它，例如

对api的服务电话

import { Http, Response, Headers, RequestOptions, URLSearchParams } from "@angular/http";
constructor(
        private authHttp: Http) {}
let url= `this.webServiceUrlGet`;
      let params = new URLSearchParams;
      params.append('id', id);
     return this.authHttp.post( url,  { headers:headers,  search:params })
    .map( res =>  res.json());

<强>组件

this.service.get(this.id)
                .subscribe(
                res => this.item= res,
                error => this.errorMessage = error
                );

如何获取通过webservice请求返回的JSON String组件

3 个答案: