How to embed svg using Renderer2?

Question

Angular

How to embed an svg component into the template using Renderer2 in Angular?

The problem is that the svg embedded in this way is not displayed in the browser, and is not visible at all in the styles inspector: here is a demo https://stackblitz.com/edit/angular-ccmzfx

At the same time, the same svg inserted in the template hands, displayed without problems. This can be seen in the same example.

Answer 1

When creating SVG elements, you must specify a namespace. That is, replace with Well and, respectively , with
this.renderer.createElement('circle', 'svg');