Angular создать реактивную форму с глубоко вложенным json - PullRequest
Новая
       42

Angular создать реактивную форму с глубоко вложенным json

2 голосов
/ 04 марта 2020

Я пытаюсь сгенерировать Angular реактивных форм, используя json. Моя json структура выглядит следующим образом. 

{
    "name": "NationalInfo",
    "field": [
      {
        "type": "textbox",
        "key": "natInfo",
        "label": "Nat Info",
        "value": "",
        "required": false,
        "order": 1
      },
      {
        "name": "NatInfo",
        "field": [
          {
            "type": "textbox",
            "key": "appNum",
            "label": "App Num",
            "value": "",
            "required": false,
            "order": 1
          },
          {
            "type": "textbox",
            "key": "brandyPhonetic",
            "label": "Brandy Phonetic",
            "value": "",
            "required": false,
            "order": 2
          },
          {
            "type": "textbox",
            "key": "cry",
            "label": "Cry",
            "value": "",
            "required": false,
            "order": 3
          },
          {
            "type": "textbox",
            "key": "natFinalDispDt",
            "label": "Nat Final Disp Dt",
            "value": "",
            "required": false,
            "order": 4
          },
          {
            "type": "textbox",
            "key": "pTOPhonetic",
            "label": "P T O Phonetic",
            "value": "",
            "required": false,
            "order": 5
          },
          {
            "type": "textbox",
            "key": "ptoStsCd",
            "label": "Pto Sts Cd",
            "value": "",
            "required": false,
            "order": 6
          },
          {
            "name": "NatInfoRejectionCodes",
            "field": [
              {
                "type": "textbox",
                "key": "rejectionCode",
                "label": "Rejection Code",
                "value": "",
                "required": false,
                "order": 1
              }
            ]
          }
        ]
      }
    ]
  }

Это всего лишь один объект в массиве объектов, у меня есть несколько объектов, таких же, как указано выше, в этом массиве с несколькими вложенными дочерними элементами.

Вывод что я хочу, это как 

this.obj = {
  "NationalInfo": new FormGroup({
    "natInfo": new FormControl(""),
    "NatInfo": new FormGroup({
      "appNum": new FormControl(""),
      "brandyPhonetic": new FormControl(""),
      "cry": new FormControl(""),
      "natFinalDispDt": new FormControl(""),
      "pTOPhonetic": new FormControl(""),
      "ptoStsCd": new FormControl(""),
      "NatInfoRejectionCodes": new FormGroup({
        "rejectionCode": new FormControl("")
      })
    })
  })
}
this.form = new FormGroup(this.obj);

, а затем я хочу сделать это в html.

Я перепробовал все доступные решения, но не смог сделать это. Буду признателен за любую помощь.

Спасибо.

...