Using JSON to store template driven form data in Angular

Question

I need to use JSON to store the form data, but I'm not sure how to go about it. I know I need to store all of the data that is gathered from text fields and radio buttons and then I need to make a form that displays the data. Can anyone point me to good resources for this? Or know how I can do this? I also need to know how I can access the data for another page since this is an application with two pages. One is for gathering data and the other is for displaying.

pls take a look at this, stackblitz.com/edit/angular-dynamic-survey-creation-xgjnhl is it the one u looking for? — naoval
– naoval, Commented Jun 15, 2021 at 3:21
I can't tell where the code for converting the data into JSON is. From what I can tell, it looks like it might help me, but I don't see where JSON is used besides the one file. — Marco Antonio Martinez
– Marco Antonio Martinez, Commented Jun 15, 2021 at 17:05
so that method converts the data into JSON? I wasn't sure because I thought there had to be something like JSON.stringify(data). Does it store it in a JSON file? — Marco Antonio Martinez
– Marco Antonio Martinez, Commented Jun 17, 2021 at 2:12

naoval · Accepted Answer · 2021-06-17 08:24:17Z

1

So basically to store form datas to JSON is simply create a JSON object and assign the form value to specified property inside that object.

my method is simple like this, on submit i add new object

let newValue = {
     inputValue : this.form.value.input,
     selectValue : this.form.value.select,
    }

thats just for an example, assignin form value to the property of our new object. then to push the data to api simply like this

pushToAPIFunc(newValue);

and the result will be like this

{
  "newValue" :{
      "inputValue" : "inputValue",
      "selectValue" : "selectValue"
   }
}

to display that data, for example u have an edit page, u can use patchValue() of that JSON to your form, or assigning that data manually to each formControlName

edited Jun 17, 2021 at 8:24

answered Jun 17, 2021 at 8:18

naoval

3687 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Marco Antonio Martinez Over a year ago

Okay yeah that helps a lot. Thank you.

Collectives™ on Stack Overflow

Using JSON to store template driven form data in Angular

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related