在 Angular 中，如何解析和提取具有复杂结构 (JSON) 的 HTTP 响应？

Question

我是 Angular 的新手，在这里需要你的帮助。 我有一个具有 API 调用功能的 Angular 服务，如下所示。

searcheBay() {
        console.log("calling ebay service");
        return this.httpClient.get (this.ebayURL);
      }

我正在从组件调用这个函数，如下所示。

this.searchService.searcheBay().subscribe((data) => {
          this.svcdata  =  data

      });

数据变量具有复杂的 JSON 结构（见下图）。

我要阅读的数据由“searchResult”元素保存。 您能否建议如何解析和提取“searchResult”元素？ 提前致谢。

我在 Safari DEV 控制台中调试并看到如下所示的元素可访问性。

当我更新组件中的相同代码时，我遇到 compile: ERROR in src/app/search/search.component.ts(20,29): error TS2339: Property 'findItemsByKeywordsResponse' does not exist on type 'Object'。 请提出你的想法。

 serviceOnButtonClick(){
 this.searchService.searcheBay().subscribe((data) => {
      this.svcdata  =  data.findItemsByKeywordsResponse[0].searchResult

  });

Answer 1

@javapedia.net 试试这个，如果你的响应data对象和你在图片中显示的一样，

this.searchService.searcheBay().subscribe((data) => {
    this.svcdata  =  data.findItemsByKeywordsResponse[0].searchResult;
    console.log(this.svcdata);
});

编辑

this.searchService.searcheBay().subscribe((data: any) => {
        this.svcdata  =  data.findItemsByKeywordsResponse[0].searchResult;
        console.log(this.svcdata);
    });

Answer 2

我最终使用了地图投影，如下所示。 希望这可以帮助。

  serviceOnButtonClick(){
 this.searchService.searcheBay().pipe(map((data:any) => data.findItemsByKeywordsResponse[0].searchResult)).subscribe((data) => {
      this.svcdata  =  data;
      console.log(this.svcdata);
  });

  }