Question

这里有一个有用的Angular教程：

https://coursetro.com/posts/code/154/Angular-6-Tutorial---Learn-Angular-6-in-this-Crash-Course

在data.services.ts文件中，有一个简单的http.get，它返回一个json负载：

return this.http.get('https://jsonplaceholder.typicode.com/users');

我希望“检查” Chrome开发人员工具中的有效负载并添加以下代码：

console.log("Payload = " + this.http.get('https://jsonplaceholder.typicode.com/users'));

但是我在Chrome浏览器中看到的是：

Payload = [object Object]

如何“查看”通过console.log（）返回的原始JSON数据？

我要检查有效负载的原因是我的要求是读取XML响应。我知道我必须将XML转换为JSON，但是我想确定自己正在获取XML。

Answer 1

http的get方法返回一个可观察的对象。可观察对象只有在已订阅时才能工作。

this.http.get('some url ') // No api call will be made. You haven't subscribe it yet. You can check your browser network tab.

所以这样写：

console.log('Print:' + this.http.get('')); // will get 'Print: + [object object] because this is not the data that has returned but an observable object.'

要实际获取数据，请订阅可观察对象，如下所示：试试这个：

this.http.get('some url ').subscribe(responseData => console.log(responseData));

Answer 2

另一种方法是通过设置响应选项来获得完整的响应。这也可以用来从响应中读取标头。

  this.http.get('https://jsonplaceholder.typicode.com/users',{ observe: 'response' })
   .subscribe(
    response => console.log(response.body)
  );

Angular.io Guide - Reading the full response

Answer 3

确保仅注销有效负载，并且不要将其与字符串（“有效负载= ...”）连接。

执行此操作会将http.get方法的输出转换为其toString（）解释，即[object Object]：

console.log("Payload = " + this.http.get('https://jsonplaceholder.typicode.com/users'));

执行此操作：

数据服务

someMethod() {
    return this.http.get('https://jsonplaceholder.typicode.com/users');
}

使用服务

someOtherMethod() {
    this.dataService.someMethod().subscribe(payload => console.log(payload));
}

您可以对服务进行以下快速测试（但请注意，不会返回任何值）：

someMethod() {
    this.http
        .get('https://jsonplaceholder.typicode.com/users')
        .subscribe(payload => console.log(payload));
}

Answer 4

好吧，我是Angular 6的新手，但是由于http.client返回一个Observable，我们必须订阅它才能获取结果，并将值输出到控制台而不是[Object object]，您必须将其传递给console.log()作为参数：

this.http.get('https://jsonplaceholder.typicode.com/users').subscribe(
  data => console.log("Payload = ", data);
);

Angular 6 http.get-在控制台中显示返回的对象

4 个答案: