title: Angular mat-table - HTML element in a cell
body: <p>I don't know if this is possible but mayB someone could help me ..</p>
  
  <p>I have a MAT-TABLE (Angular material) with many columns (I built a MatTableDataSource and everything is dynamic)</p>
  
  <p>In one of these columns I'd like to put an information i'm getting from an other application :</p>
  
  <ul>
  <li>if the information is not null, i just display it as a string in the column (no problem for this)</li>
  <li>if the information is null, I'd like to put a select element in my cell</li>
  </ul>
  
  <p>So i'm doing the following in the TS file :</p>
  
  <p>• if (information not null) => data = [...,attribut:information,...]</p>
  
  <p>• if (information is null) => data  = [...,attribut:<code>&lt;select&gt;&lt;option&gt;test&lt;/option&gt;&lt;/select&gt;</code>
  ,...]</p>
  
  <p>But it appears as a string in my application and not as an HTML element
  How can I proceed ?</p>
  
  <p>what i want to do, but easier explaination :</p>
  
  <pre><code>public test: any;
  this.test = `&lt;select&gt;&lt;option&gt;opt1&lt;/option&gt;&lt;option&gt;opt2&lt;/option&gt;&lt;/select&gt;`;
  </code></pre>
  
  <p>in template :</p>
  
  <pre><code>&lt;div&gt;
    {{test}}
  &lt;/div&gt;
  </code></pre>
  
  <p>but here my result :
  <a href="https://i.stack.imgur.com/IRCmr.png" rel="nofollow noreferrer">result</a></p>
  
  <p>how to build an HTML element in my TS file and then show it in my html file ? thanks</p>