Run method after array is updated
<p>I have a service where I fetch some data form Firebase. That service offers an observable, which I then subscribe to in my component class. When the data is loaded, and sent to the array, the DOM updates with new data, but I need to run some javascript and jQuery code again after the DOM update which I can't figure out how to.</p>

<p>My service method looks like this:</p>

<pre><code>getSubjects() {
    return new Observable(observer =&gt; {
      this.subjectsRef.orderByChild('name').on("value", snapshot =&gt; {
        var tempArr = [];
        snapshot.forEach(function(data) {
          var subject = {
            name: data.val().name,
            imgUrl: data.val().imgUrl,
            description: data.val().description,
            teachers: data.val().teachers
          }
          tempArr.push(subject);
        });
        observer.next(tempArr);
      });
    // this.broadcastUpdate();
  });
  }
</code></pre>

<p>And my component:</p>

<pre><code>export class SubjectsCmp implements AfterViewInit, OnInit, OnChanges {

  constructor(
    private _subjectsService: SubjectsService
  ) {
  }

  ngOnInit() {
    this._subjectsService.getSubjects().subscribe( subjects =&gt; this.subjects = subjects);
  }
}
</code></pre>

<p>I've looked a bit at the <a href="https://github.com/Reactive-Extensions/RxJS/blob/master/doc/api/core/operators/subscribe.md" rel="nofollow">documentation for RxJS</a> but to no avail. I thought I could rewrite it to follow the example they give::</p>

<pre><code>var subscription = source.subscribe(
  function (x) {
    console.log('Next: %s', x);
  },
  function (err) {
    console.log('Error: %s', err);
  },
  function () {
    console.log('Completed');
  });
</code></pre>

<p>But 'Completed' never fires.</p>

<p>Angular 2's onChanges observer only responds to changes caused by input events, so that won't work either.
Basically I just need to run a method after the array is populated, I'm thinking I'm missing something obvious?</p>