Перебрать объект в Angular 9

Question

Я хочу перебрать ответ объекта из моего JSON ответа в Angular 9 / Typescript. Я попытался найти то же самое, но другие результаты мне не помогли. Ниже мой JSON, я хочу перебрать «детали», чтобы я мог извлечь каждый узел, такой как «личные данные», «рабочие данные» и «номер телефона», чтобы создать динамическую форму c. Спасибо.

Примечание: Я пытаюсь сделать это с помощью функции из .ts, а не из * ngFor.

"details":
{
  "personalDetails":
  {
    "title" :"Personal Details",
    "fields":
    [
      {
        "label":"First Name",
        "type":"text",
        "validation":
        {
          "required":true
        }
      },
      {
        "label":"Last Name",
        "type":"text",
        "validation":
        {
          "required":true
        }
      }
    ]
  },
  "workDetails":
  {
    "title" :"Work Related Details",
    "fields":
    [
      {
        "label":"Company Name",
        "type":"text",
        "validation":
        {
          "required":true
        }
      },
      {
        "label":"Date Of Joining",
        "type":"date",
        "validation":
        {
          "required":true
        }
      }
    ]
  },
  "phoneNumberDetails":
  {
    "title" :"Phone Number Details",
    "fields":
    [
      {
        "label":"Primary Contact",
        "type":"number",
        "validation":
        {
          "required":true
        }
      },
      {
        "label":"Secondary Contact",
        "type":"number",
        "validation":
        {
          "required":false
        }
      }
    ]
}

Answer 1

Object.keys(result).forEach((key)=>{ const value = result[key]; }) - это то, как вы можете перебирать объект.

Я создал stackblitz, который показывает, как это можно сделать.

https://stackblitz.com/edit/angular-material-starter-xfae4t

Answer 2

returnedDetails = {
  details: {
    personalDetails: {
      title: "Personal Details",
      fields: [{
          label: "First Name",
          type: "text",
          validation: {
            required: true
          }
        },
        {
          label: "Last Name",
          type: "text",
          validation: {
            required: true
          }
        }
      ]
    },
    workDetails: {
      title: "Work Related Details",
      fields: [{
          label: "Company Name",
          type: "text",
          validation: {
            required: true
          }
        },
        {
          label: "Date Of Joining",
          type: "date",
          validation: {
            required: true
          }
        }
      ]
    },
    phoneNumberDetails: {
      title: "Phone Number Details",
      fields: [{
          label: "Primary Contact",
          type: "number",
          validation: {
            required: true
          }
        },
        {
          label: "Secondary Contact",
          type: "number",
          validation: {
            required: false
          }
        }
      ]
    }
  }
};

// After setting up the object like you have, we have to make sure we
// look at the details property specifically.
for (let key of Object.keys(returnedDetails.details)) { 
  let detail = returnedDetails.details[key];
  console.log(detail.title);
  console.log(detail.fields);
}