Friday, 26 November 2021

How to patch a reactive form with multi nested json values

I am using the value of a multi nested (Infinity level) reactive form which contains formArray, formGroups and formControls. Which is stored in DB.

Currently, I am patching the form using a recursion function that loops through the entire JSON and makes formArrays, formGroups and formControls based on keys and values.

Now the issue is, this method which I am using is not good as per performance perspective, so is there any better way to patch this kind of multi nested form in one go? (Just create form, no need to show in HTML)

This is simplified JSON for question reference -

Any section can have subSections and then subSections can have some kind of section

const formDataSections = [
  {
    index: 1,
    sectionName: "",
    subSections: [
      {
        index: 1,
        subSectionName: "",
        sections: [
          {
            index: null,
            sectionName: "",
            subSections: [
              {
                index: null,
                subSectionName: "",
                sections: [
                  {
                    index: null,
                    sectionName: "",
                  },
                  {
                    index: null,
                    sectionName: "",
                    subSections: [
                      {
                        index: null,
                        subSectionName: "",
                        sections: [
                          {
                            index: null,
                            sectionName: "",
                          },
                          {
                            index: null,
                            sectionName: "",
                            subSections: [],
                          },
                        ],
                      },
                    ],
                  },
                ],
              },
            ],
          },
          {
            index: null,
            sectionName: "",
            subSections: [
              {
                index: null,
                contentTypes: [],
                sections: [
                  {
                    index: null,
                    sectionName: "",
                    subSections: [],
                  },
                ],
              },
            ],
          },
        ],
      },
    ],
  },
];


from How to patch a reactive form with multi nested json values

No comments:

Post a Comment