如何使用* ngFor迭代对象键

Question

如何使用* ngFor迭代对象键

我想在Angular 2中使用* ngFor迭代[object object]。

问题是对象不是对象数组而是包含更多对象的对象对象。

{
  "data": {
    "id": 834,
    "first_name": "GS",
    "last_name": "Shahid",
    "phone": "03215110224",
    "role": null,
    "email": "[e-mail]",
    "picture": **{ <-- I want to get thumb: url but not able to fetch that**
      "url": null,
      "thumb": {
        "url": null
      }
    },
    "address": "Nishtar Colony",
    "city_id": 2,
    "provider": "email",
    "uid": "[e-mail]"
  }}

我知道我们可以使用管道迭代对象，但我们如何能够从对象进一步迭代意味着data-> picture-> thum：url。

Answer 1

我认为最优雅的方法是使用这样的javascript&nbsp;Object.keys：在Component中将Object传递给模板：Object&nbsp;=&nbsp;Object;然后在模板中：<div&nbsp;*ngFor="let&nbsp;key&nbsp;of&nbsp;Object.keys(objs)"> &nbsp;&nbsp;&nbsp;my&nbsp;key:&nbsp;{{key}} &nbsp;&nbsp;&nbsp;my&nbsp;object&nbsp;{{objs[key]&nbsp;|&nbsp;json}}&nbsp;<!--&nbsp;hier&nbsp;I&nbsp;could&nbsp;use&nbsp;ngFor&nbsp;again&nbsp;with&nbsp;Object.keys(objs[key])&nbsp;--></div>