title: Angular how to generate dynamically component without the selector tag
body: <p>I am struggling to generate components dynamically without their component tag. Basically I have a main component with a svg picture in it. </p>
  
  <p>I'm trying to write a component witch is going to generate rectangles inside that tag svg. I tried following the angular tutorial for dynamic components, but <a href="https://i.stack.imgur.com/pUX57.png" rel="nofollow noreferrer">here</a> is what I get when I generate the component:</p>
  
  <p>Unfortunately, due to the ng-component, nothing is displayed.</p>
  
  <p>here is the component template :</p>
  
  <pre><code>@Component({
    selector: '',
    template: ``&lt;svg:rect width="1000px" height="1000px" fill="white"&gt;``,
    styleUrls: ['./shape-tool.component.scss']
  })
  </code></pre>
  
  <p>here is my main component html :</p>
  
  <pre><code>&lt;div class="main"&gt;
      &lt;svg #svg version="1.1" baseProfile="full" width="400" height="400" xmlns="http://www.w3.org/2000/svg"&gt;
          &lt;ng-template svgDynamic&gt;&lt;/ng-template&gt;
      &lt;/svg&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I only want the rectangle tag to get in the svg tag when the user clicks the main component.</p>