title: Angular 4 dispatchEvent with custom event
body: <p>My requirment is to fire event from the code to a parent hosting component.</p>
  
  <p>I used the first answer here as a reference: <a href="https://stackoverflow.com/questions/36639486/angular2-manually-firing-click-event-on-particular-element">angular2 manually firing click event on particular element</a></p>
  
  <p>If I try this, it works well:</p>
  
  <pre><code>this.itemHost.viewContainerRef.element.nativeElement.dispatchEvent(new Event('click'));
  </code></pre>
  
  <p>In the parent component I wrote this:</p>
  
  <pre><code>(click)="go()"
  </code></pre>
  
  <p>It arrives to the go method when the above code occurs.</p>
  
  <p>But this doesn't work if I do it with some custom event name, e.g.:</p>
  
  <pre><code>this.itemHost.viewContainerRef.element.nativeElement.dispatchEvent(new Event('customEvent'));
  </code></pre>
  
  <p>and in the parent component:</p>
  
  <pre><code>(customEvent)="go()"
  </code></pre>
  
  <p>How can I do it with custom event?</p>