How to create a dynamic template in Angular?

Question

Angular

I have JSON object data:

let data = {
     id: 1,
     имя: "Блок1",
     fields: [{id: 1, fieldType: "input"}, {id: 1, fieldType: "table", sourceUrl: "http: //"}]
}

This object can contain more than 100 field elements.

I need to create an HTML view template based on this template.

I took the first step where I iterate over the fields of an object and show the form of a particular element (input, text field, etc.) based on the fieldType.

Now the task is to dynamically build the table base of type fieldType: "table". When there is a sourceUrl where the data is to be loaded and output.

I do it in *ngFor right in the template.

How to show the table?

I think calling http sourceUrl from a template in an ngfor loop is a bad idea.

Answer 1

well there are options

I think calling http sourceUrl from a template in an ngfor loop is a bad idea.

Watching how to do it, for example like this https://ngxf.gitbook.io/platform/server-interactio...
Another option is to immediately make requests and build data when receiving the original Json.
You can also display components in ngFor, pass the request url to them, and execute the request inside them in ngOnInit.