title: How to listen to children elements events in a directive?
body: <p>Since there is no template, what's the best way to listen to child elements event in a directive? Is it possible with <code>HostListener</code>? If not, is there any other way?</p>
  
  <p>There's also this similar question: <a href="https://stackoverflow.com/questions/37781522/how-to-listen-for-child-event-from-parent-directive-in-angular2">How to listen for child event from parent directive in Angular2</a>, but the suggested approach does not solve my problem, as my directive and child element aren't in the same template (directive is on host).</p>
  
  <p>Cheers! </p>
  
  <p><strong>Edit #1</strong></p>
  
  <p>This is how I'm currently doing it (there has to be a better way):</p>
  
  <p>First injecting <code>ElementRef</code> into my directive: </p>
  
  <pre><code>constructor(private elView: ElementRef) {}
  </code></pre>
  
  <p>Then binding with jQuery (or plain JS):</p>
  
  <pre><code>$(this.elView.nativeElement)
  .on('drag', '#childId', this.slide.bind(this))
  </code></pre>