Angular Schematics - Create Interface/Model from JSON Response

Question

As I am trying to automate my Development process, I would like to create a Ts/Angular Interface based on a JSON response.

Let‘s say that I am getting a response which looks like this

{"name":"John", "age":30, "car":“Honda“}

The Final outcome should Look like this

export interface User {
    name: String,
    age: Number,
    car: string 
}

A little more background: As I have to implement a lot of list components i would like to generate a schematic which creates a generic List component where i can pass any data and display it. Therefore i would like to create a custom interface as well

I have searched the internet with a lot of different search queries but could Not find an accurate solution therefore if somebody could give me a hint if there is an api, code example or whatever I would be really grateful

score 0 · Answer 1 · answered Oct 03 '22 at 08:30

you could add swagger file generation on your server, and then generate full api layer from that swagger specification with the help of ng-openapi-gen for example. I would say that is the best way if you are using rest api in your application.

If not - there are things like graphql or trpc that provide their own solutions for this problem

score 0 · Answer 2 · answered Oct 03 '22 at 08:47

You can treat JSON like generic List, also you can pass any data and display it. What needs to be mapped to an interface?

var responseData=[{"name":"John", "age":30, "car":"Honda"},{"name":"hosseinSabz", "age":32, "car":"pride"}];
for(let i=0 ; i<responseData.length ; i++)
{
    console.log(responseData[i].name);    
   // or console.log(responseData[i]['name'])
}

Angular Schematics - Create Interface/Model from JSON Response

2 Answers2