Question

我正在开发Angular的应用程序。

我有这个问题。我放置debugger;是因为我想在this.facturas标签的watch部分中看到返回属性source的内容。但是，运行该应用程序并将其停在我想要的位置之后，当看着watch时，我得到的undefined是this.facturas，但实际上它具有一个值：这是一个对象数组，正在我的.html模板的表中填充行的td's。

.ts代码：

 this.documentosService.getFacturas(this.requestCuatro).subscribe((data: any) => {
      if (data) {
        if (data.documentos.length == 0 && data.error.codError == 0) {
          swal("Stop! Trolls and Dragons found!");
        } else {
          this.facturas = data.documentos;
          debugger;       
        }

        if (data.error.codError != 0) {
          swal("Warning! Sorry, the old Monarc Elf died :(");
        }
      }
    });

我希望能够看到我从服务器获取的值，但是我不确定如何。我正在看this.facturas，但是我不确定，所以我在编码，好像我的眼睛被遮住了。

有帮助吗？谢谢。

Answer 1

尝试观看_this.facturas或this_.facturas。 Angular是从Typescript转换而来的javascript，并且因为您在箭头函数中，所以该类的this属性将存储在另一个变量（this_或_this，现在不记得了）中，以维护this上下文在您的代码中。

我个人不使用调试器中的“监视”，而是通常只在“作用域”部分中查看。尽管this没有引用正确的上下文，但在这里我从来没有遇到过问题。也许您在未启用源映射的情况下进行编译。

Answer 2

查看API响应的两种更可靠的方法：

记录响应-这会将值直接输出到“控制台”选项卡。

} else {
  this.facturas = data.documentos;
  console.log(this.facturas);       
}

改为观看“网络”选项卡：可直接在“网络”选项卡下观察网络/ API请求。找到发出的请求，然后检查响应正文：https://developers.google.com/web/tools/chrome-devtools/network/reference#response

Chrome Dev Tools中观看的表达式未显示价值

2 个答案: