Angular component not rendering when passed as a string in a innerHtml attribute

Question

I use an api that returns some html. Angular components are used in the html code but not shown in the application.

How can I show an angular component when it is stored as a string?

StackBlitz demo

Answer 1

In general, this goes against how Angular works. There is no Angular feature for [innerHTML]. There are no component selectors there, not even a ViewContainerRef. Instead, because Angular exclusively trusts its own templates, any HTML, CSS, and JS that even appears somewhat suspect is eliminated as a security safeguard. So InnerHTML is outside limits.

You can try to dynamically load components and content with the ViewContainerRef.