如何在TypeScript中将Firebase REST API响应转换为数组？

Question

我目前在处理使用Angular应用中REST到Firebase实时数据库所做的响应数据时遇到了问题。提前说明：说实话，我正在慢慢学习Angular和Firebase。

我的数据库中有一个名为“pending-orders”的子路由。

https://i.imgur.com/C1EXaEi.png

那里的每个唯一ID都与当时下订单的登录用户匹配。

为了获得我所有待处理订单，我向我的数据库发送GET http请求，端点是“pending-orders.json”，正如Firebase文档建议的那样。

这给了我一个响应，我认为它将是一个数组。但实际上它是一个带有嵌套对象的对象。我记录了响应：

{G2v12VlKwNPXwtUDV4g41PIqHZx1: {…}, hYgflcf7WGR6wLrCPkAL1B4MbZI3: {…}}

然而我需要的是一个包含子节点（该响应对象中键的值）的数组。我不确定如何获取一个数组。如何完成这项工作？

顺便说一句...

事实上，我甚至不知道如何提取一个其唯一ID是Firebase自己生成的子节点（通过POST请求）。

除非我在REST API文档中跳过了某些内容，否则它们涵盖了新插入的子节点如何通过POST请求获得自己的唯一ID，但随后没有特别讨论如何访问这些子节点或通过集合访问（就像我正在尝试做的）。据我所知，客户端无法知道这些唯一ID（或我自己生成的自定义ID）。

- Mar

---

只是提供信息：AngularFire 提供了一个 TypeScript API，用于实时数据库，因此您不必直接使用 REST API。 - Doug Stevenson

你可以直接使用 Angular File。 - Bargros

当然，你可以使用for ... in循环或Object.entries()将其转换为数组。或者这不适合你的需求？ - JayCodist

Answer 1

因为TypeScript实际上就是JavaScript，所以你可以做以下事情：

const pendingOrdersResponse = await firebase.handwaving.pendingOrders();
const pendingOrdersTransformed = Object.keys(pendingOrdersResponse).map(id => {
  return { uuid: id, ...pendingOrdersResponse[id] };
});

那么 pendingOrdersTransformed 将是一个数组，其中包含数组中每个 pendingOrder 的生成 ID 作为每个对象的 uuid 字段，而该数据以普通 JavaScript 对象的形式存在于数组中。

- Sean Vieira

Answer 2

继Jay Codist的评论之后，我根据从Firebase获取的响应数据构建了自己的ProcessedOrders数组。我想出的解决方案如下：

fetchPurchaseOrders(): void {
this.http
  .get('https://APP-NAME.firebaseio.com/pending-orders.json')
  .subscribe((res) => {
    if (res) {
      const processedOrders: ProcessedOrder[] = [];
      for (const [key, value] of Object.entries(res)) {
        processedOrders.push(value as ProcessedOrder);
      }
      console.log(processedOrders);
    }
  });

}

这使我能够保存订单，而不必关心我在数据库中为每个子节点设置的自定义ID。那里的console.log()使我能够按照我想要的方式打印出所有订单。这意味着ProcessedOrders数组现在可以按照我想要的任何方式在应用程序中使用。

我不禁想知道，如果没有仔细考虑，我可能已经通过这种方法破坏了我的数据结构。如果我只想查看订单，这种方法将非常好，但如果我想从管理方面更新任何信息，情况就不太一样了，因为我仍然必须依赖我最初给它们的自定义ID。

我也可能花时间学习AngularFire，正如其他评论者所建议的那样。也许它会比REST API更好、更容易理解。

无论如何，问题已经得到解决，因为我最初提出问题的意图是如何将响应转换为数组。

谢谢大家的帮助！

- Mar