Angular2映射并使用typescript迭代JSON对象

Question

在我的应用中，我发出了一个返回JSON的http请求。

以下是JSON的结构：https://demo6902979.mockable.io/data

{
  "6288ba45-3b41-4862-9fed-7271245b9c29": {
    "id": "6288ba45-3b41-4862-9fed-7271245b9c29",
    "name": "name1",
    "possibilities": {
      "a48382bf-dde6-479d-8456-beee63f592be": {
      "id": "a48382bf-dde6-479d-8456-beee63f592be",
      "data": "anydata1",
      "style": null
      },
      "d62fb2d2-58a6-458c-9e7f-78774af4d9fe": {
      "id": "d62fb2d2-58a6-458c-9e7f-78774af4d9fe",
      "data": "anydata2",
      "style": null
      }
    }
  },
  "860aefe6-ff70-436b-8d2b-554251e8fb59": {
    "id": "860aefe6-ff70-436b-8d2b-554251e8fb59",
    "name": "name2",
    "possibilities": {
      "e30ef32b-20c2-4ddc-8d5f-e5f1fc35a6b7": {
      "id": "e30ef32b-20c2-4ddc-8d5f-e5f1fc35a6b7",
      "data": "anydata3",
      "style": null
      },
      "49e8b455-848c-4cb2-bb84-5b7b3bc5fc4a": {
      "id": "49e8b455-848c-4cb2-bb84-5b7b3bc5fc4a",
      "data": "anydata4",
      "style": null
      }
    }
  }
}

这是我的代码：

return this.http.get(`https://demo6902979.mockable.io/data`)
    .map((res: Response) => res.json())
    .filter((choices) => choices.id === "6288ba45-3b41-4862-9fed-7271245b9c29")
    .subscribe(
      data => {
        this.Data = data;
        console.log('Data:', data);
      },
      error => {
         console.log('Get data failed Error:', error);
      }
    );

无法正确过滤

我试图在这个JSON上设置一个filter来获取当前ID为＆＃34; 6288ba45-3b41-4862-9fed-7271245b9c29＆＃34;例如。它没有工作，也没有返回任何东西。

无法遍历JSON对象

由于我无法过滤，我暂时删除了过滤行，并尝试遍历此JSON以获取数据和样式。要访问它，例如，使用this.Data.possibilities.data（我不知道如何检索可能性ID以执行this.Data.possibilities.[UUID].data或this.data.possibilities[0].data）。

我在代码中努力做到这一点。控制台返回一个Object格式的JSON，我真的不知道如何遍历它。我尝试使用this.Data.forEach()，但它返回一个错误，因为for.ach在this.Data元素上不存在。

我在Angular2上看到的每个解决方案都在ngFor中，但我需要在组件类中直接执行此操作。

感谢您的帮助。

Answer 1

过滤器适用于Array。您的数据（对象文字）不是数组 您可以使用Object.keys映射对象的属性，然后将它们映射到实际值。

store_id