title: Change Detection and Events from outside of Angular
body: <p>I have created and Angular 7 Application that uses a very large external library. I have all thing wired up with success with the exception of an event from that external sources. </p>
  
  <p>I have an event listener on that external sources that fires and sends data to my Angular App. </p>
  
  <pre><code>externalApp.event((data)=&gt;{
    this.externalMonitorService.newData(external.data)
  });
  </code></pre>
  
  <p>That works fine.</p>
  
  <p>This function then uses a BehaviorSubject and emits the data</p>
  
  <pre><code>newData(data){
    this.mySubject.next(data);
  }
  </code></pre>
  
  <p>That is working fine as well.</p>
  
  <p>I can subscribe to this in any component and I get changes, it works fine.</p>
  
  <p>However, in my template I can not use async pipe as it does not detect the changes. I have to <code>ChangeDetectorRef</code> and update a variable and then call detectChanges.</p>
  
  <p>I don't want to have to worry about this subscription, to have to implement this logic in every component, it is very ummmm... <em>reactive breaking</em>.</p>
  
  <p>Am I missing something deep in Angular I do not know about? Is there a way in angular, perhaps NgZone where I can call something that lets Angular know, this data is coming from an external source treat this as a change, thus I will not have to implement this logic everywhere. </p>