title: Angular 6 rendering HTML tag with ngFor loop with interpolation
body: <p>i'm having a problem with template rendering (ANGULAR 6) and a library for creating floating panels (<a href="https://jspanel.de/index.html" rel="nofollow noreferrer">jsPanel 6</a>) that is plain javascript. To sum up:</p>
  
  <p>In my template, after rendering it, i have one BUTTON that triggers this function:</p>
  
  <pre><code>public openPanel()
    {
  
      let list: Array&lt;number&gt; = [1, 2, 3];
  
      let tag : string = '&lt;ul&gt; &lt;li *ngFor="let i of list"&gt; {{ i }} &lt;/ul&gt;';
  
        jsPanel.create({
          theme:       'primary',
          contentSize: {
              width: function() { return Math.min(730, window.innerWidth*0.9);},
              height: function() { return Math.min(400, window.innerHeight*0.5);}
          },
          position:    'center-top 0 250',
          animateIn:   'jsPanelFadeIn',
          headerTitle: 'I\'m a jsPanel',
          content:     tag,
          onwindowresize: true
      });
  
    }
  </code></pre>
  
  <p>The problem is that Angular doesn't render the ngFor, it doesn't go trough the loop and also, it doesnt get the ``{{ i }}´´ interpolation. I'm using typescript by the way.</p>
  
  <p><a href="https://i.stack.imgur.com/xGYyo.png" rel="nofollow noreferrer">result after clicking the button</a></p>
  
  <p>Is there away without using Dynamic Component Loader to render that?.</p>
  
  <p>Thanks</p>