Is there a function to get html with data-gjs-type attributes from the editor? Or a function that converts page or component JSON (comes from database) to HTML with component definitions?

[FaisalShaikhHA]

• Is there a function to get HTML with data-gjs-type attributes from the editor? This will help recognize components.
• Same as editor.getHtml() which returns the final HTML but I want data-gjs-type as well so that I can load my page in the editor using that HTML because I have a dynamic template like header & footer which will be updated frequently and then I can append this HTML between my template.
• Or a function that converts page or component JSON (comes from database) to HTML with component definitions so that I can load and append this HTML between my template.
• In short, I need HTML with components definition which I can append between the template and editor to recognize all the components. Thanks in advance.

[artf]

You can try to use this editor.getHtml({ withProps: true })/component.toHTML({ withProps: true }) (still experimental) but I'd always suggest finding a way to rely only on the JSON data as HTML is not totally reliable to recover all the information.

[FaisalShaikhHA]

Thanks, @artf for the suggestion.
How can I populate a component using JSON data returned by this code JSON.stringify(component) or how to get a collection of child components so that I can append these children again?
Is this approach better than the above HTML approach?
Or
Can I use this JSON.stringify(component) object and merge it in JSON data?

            const wrapper = editor.getWrapper();
            const cmp = wrapper.findType("editable")[0];
            console.log(JSON.stringify(cmp)); // use this data to populate editable component again
                                OR
            let childComps = cmp.components(); // 
            cmp.components(childComps); // does not work. Makes child component blank

[artf]

You should be able to do that by doing this: cmp.components(JSON.parser(JSON.stringify(childComps)));

[FaisalShaikhHA]

@artf this let childComps = cmp.components(); returns only HTML as JSON styles are not included.
How can I get styles as well and then repopulate the component again? using cmp.components(JSON.parser(JSON.stringify(childComps))); or any other way please help thank you.