title: Subject triggering only once after pipe and mergeMap
body: <p>This is the declaration for the subject and observable:</p>
  <pre class="lang-js prettyprint-override"><code>private subscription: Subscription;
  private subject = new Subject();
  public observable$: Observable&lt;any&gt; = defer(() =&gt; this.subject)
  </code></pre>
  <p>I am having an issue with resolving a flow involving the flattening of the following nested subscriptions:</p>
  <pre class="lang-js prettyprint-override"><code>// This works
  
  this.subscription = this.observable$.subscribe(
      (response) =&gt; {
          console.log(&quot;triggered&quot;)
          return this.otherService.function(response).subscribe(
              (response) =&gt; {
                  // handle if success
              },
              (error) =&gt; {
                  // handle if fail
              }
          )
      },
  );
  </code></pre>
  <p>Now, I've tried using a pipe and a mergeMap/switchMap/concatMap but none of them seem to work. The <code>console.log(&quot;triggered&quot;)</code> is only called once, despite the subject changing values over time. Exemple:</p>
  <pre class="lang-js prettyprint-override"><code>this.subsctiption = this.observable$.pipe(
      concatMap((response) =&gt; {
          console.log(&quot;triggered&quot;)
          return this.otherService.function(response)
      })
  ).subscribe(
      (response) =&gt; {
          // handle if success
      },
      (error) =&gt; {
          // handle if error
      }
  )
  </code></pre>
  <p>Finally, this is how the subject is calling next. It's a function handle from an event output from child component</p>
  <pre class="lang-js prettyprint-override"><code>public handleNextValue(nextValue) {
    console.log(nextValue) // this also prints successfully so the value is passed correctly
    this.subject.next(nextValue);
  }
  </code></pre>
  <p>What I am doing wrong here? Why the first approach works while the 2nd is only triggering the console.log only once?</p>
  <hr />
  <p>Later edit:
  Thanks to Chris Hamilton there is a stackblitz example <strong>which actually works</strong> as intended: <a href="https://stackblitz.com/edit/angular-ivy-ppxhpg?file=src/app/app.component.ts" rel="nofollow noreferrer">https://stackblitz.com/edit/angular-ivy-ppxhpg?file=src/app/app.component.ts</a>
  However this makes me even more confused on what might be wrong inside my code, since the subject's next value is correctly called.</p>