title: RxJS - FlatMap observer called multiple times
body: <p>I'm trying to understand how <strong>flatMap</strong> works. I understand that it is a way for handling Observable&lt; Observable &lt; T>>. </p>
  
  <p>Anyhow, I was testing the behaviour of it and got stuck with this:</p>
  
  <pre><code>let plusDom = document.querySelector('#plus');
  let minusDom = document.querySelector('#minus');
  
  let minusSource = Rx
                .Observable
                .fromEvent(minusDom, 'click');
  
  let plusSource = Rx.Observable
    .fromEvent(plusDom, 'click');
  
  plusSource
    .flatMap(function(c){
      console.log('Flatmap called');
      return minusSource;
    })
    .subscribe(function(e){
    console.log('done');
  })
  </code></pre>
  
  <p>Here it is the jsbin: <a href="https://jsbin.com/sefoyowuqe/edit?html,js,console,output" rel="nofollow noreferrer">https://jsbin.com/sefoyowuqe/edit?html,js,console,output</a></p>
  
  <p>I don't understand this behaviour:</p>
  
  <pre><code>3 clicks on plusDom prints:
  Flatmap called
  Flatmap called
  Flatmap called
  </code></pre>
  
  <p>1 click on minusDom prints:</p>
  
  <pre><code>done
  done
  done
  </code></pre>
  
  <p><strong>Why when clicking the minusDom it replays the events as many times as we have click the plusDom?</strong></p>