title: Merge two observables, single output
body: <p>Hello guys I'm trying to grasp RxJS lib and the whole idea of reactive programming.
  I'm trying to merge two observables into one. First observable contains an array of objects <code>DefectImages[]</code> the second observable contains an array of strings, which then I convert to an array of  <code>DefectImages[]</code>. After that I would like to merge these two observables into one.</p>
  <p>Below my code:</p>
  <pre><code>const observable = CachedPhotosBuffer.getInstance().asObservable()
        .pipe(
          switchMap(data =&gt; {
            return data.map((url) =&gt; DefectImage.createTempImage(url, 'you', Date.now()));
          })
          );
      this.observable = Observable.create(observer =&gt; observer.next(this.defectImages));
      this.observable.pipe(
        merge(observable)
      ).subscribe(data =&gt; console.log('merge', data))
  </code></pre>
  <p>This KIND OF works as I expect BUT this merged observables Is connected to HTML Angular template.</p>
  <pre><code>&lt;ion-list&gt;
      **&lt;ng-container *ngFor=&quot;let image of observable | async&quot;&gt;**
        &lt;ion-item *ngIf=&quot;image.deletedAt === undefined&quot;&gt;
          &lt;span class=&quot;item-container&quot; (click)=&quot;showImage(image)&quot;&gt;
            &lt;ion-thumbnail item-start&gt;
              &lt;img id=&quot;{{image.url}}&quot; src=&quot;{{getUrl(image) + image.url}}&quot;&gt;
            &lt;/ion-thumbnail&gt;
            &lt;span&gt;
              &lt;p&gt;created at: {{image.createdAt | date: 'd/M/yy H:m'}}&lt;/p&gt;
              &lt;p&gt;created by: {{image.createdBy}}&lt;/p&gt;
            &lt;/span&gt;
          &lt;/span&gt;
          &lt;button ion-button item-end (click)=&quot;removeImage(image)&quot;&gt;
            &lt;ion-icon name=&quot;trash&quot;&gt;&lt;/ion-icon&gt;
          &lt;/button&gt;
        &lt;/ion-item&gt;
      &lt;/ng-container&gt;
    &lt;/ion-list&gt;
  </code></pre>
  <p>Console logs that I'm getting:
  <a href="https://i.stack.imgur.com/ZVCCC.png" rel="noreferrer"><img src="https://i.stack.imgur.com/ZVCCC.png" alt="enter image description here" /></a></p>
  <p><strong>My question is Why do I have two separate logs for each stream instead of One console log with all the data combined?</strong></p>