title: Angular2 - catch/subscribe to (click) event in dynamically added HTML
body: <p>I'm attempting to inject a string that contains a <code>(click)</code> event into the Angular2 template.  The string is dynamically retrieved from the back-end much after the DOM is loaded.  No surprise here that Angular won't recognize the injected <code>(click)</code> event.</p>
  
  <p>Example template:</p>
  
  <pre><code>&lt;div [innerHTML]="test"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>Example string given from back-end:</p>
  
  <pre><code>var test = "When ready, &lt;span (click)=\"itemClick($event)\"&gt;click me&lt;/span&gt;."
  </code></pre>
  
  <p>Example function call in the Angular component:</p>
  
  <pre><code>itemClick(event) {
     debugger;
  }
  </code></pre>
  
  <p><hr>
  My next guess would be to try having Angular subscribe or catch a plain-old javascript event, so the string would then be:</p>
  
  <pre><code>var test = "When ready, &lt;span onClick=\"itemClick($event)\"&gt;click me&lt;/span&gt;."
  </code></pre>
  
  <p>Sure enough, I get an error that <code>itemClick is not defined</code>, so I know it's looking for that javascript function.</p>
  
  <p><strong>So question:</strong> How can I get Angular2 to subscribe to this event or function?</p>