title: Apply a directive on a DOM element using getElementById in angular 7
body: <p>I have some HTML generated by a third party (plotly), and I would love to apply a directive that we already have on one of the DOM elements it creates.</p>
  <p>The directive opens a colorPicker on click and sets colors to strings.</p>
  <p>I can reach the element with <code>querySelector</code>, or <code>getElementById</code>, but how can I transform / wrap it so I can add a <strong>directive</strong>?</p>
  <p>I tried:</p>
  <pre><code> const el = document.getElementById('myEl');
   const comp = new ElementRef(el)
  </code></pre>
  <p>or:</p>
  <pre><code>const comp = this.renderer.selectRootElement(el)
  </code></pre>
  <p>but <code>comp</code> didn't turn up to be helpful</p>