TypeScript 如何循环遍历对象数组

如何解决TypeScript 如何循环遍历对象数组

我目前正忙于一个 Angular 项目，我从 API 接收一个包含一组对象的对象。

“reportData”是通过我的服务作为参数发送到 API 的对象。

从 API 发回的数据示例：

我想遍历数组并将产品名称推送到数组中，并且与 averageQuantityOrdered 相同，但我不知道如何遍历数组并获取值。

让我感到困惑的一件事是，当您查看附加的屏幕截图时，结果似乎是一个包含对象数组的对象。我认为这就是我不能循环遍历它的原因，因为从技术上讲，它是一个对象而不是数组。

我尝试了这样的操作（retrievedData 是对象数组），但随后出现错误“无法读取未定义的属性 'forEach'”：

retrievedData: any;

this.retrievedData.array.forEach(element => {
          this.productNames.push(element.ProductName);
        });

我使用服务来检索数据：

onSubmit(form:NgForm)
  {

    this.service.postReportData().subscribe(
      res => {
        this.retrievedData = res;
        console.log(this.retrievedData);
      },err => {
        console.log(err);
      }
    );

  }

任何帮助将不胜感激！

解决方法

所以你收到的是一个包含对象数组的对象

你的 res 应该是类型

type Item = {
  ProductName: string;
  AverageQuantityOrdered: number;
  ProductOrders: unknown[];
}

type RetrievedData = {
  reportData: Item[];
}

因此您可以将 RetrievedData 设置为 retrievedData 变量的类型

retrievedData: RetrievedData

而不是any

然后 retrievedData.reportData 会给你数组。

,

感谢大家的宝贵意见！

我使用以下代码使其工作：

onSubmit(form:NgForm)
  {
    this.service.postReportData().subscribe(
      res => {
        this.retrievedData = res;

        this.retrievedData.reportData.forEach(function (item) {
          console.log(item);
          console.log(item.ProductName);
          console.log(item.AverageQuantityOrdered);
        });

      },err => {
        console.log(err);
      }
    );

  }

由于 reportData 包含对象数组，我必须遍历它而不是检索数据。

再次感谢大家，感谢您的帮助！