title: Writing an observable that you can subscribe too and makes an http call once
body: <p>I'm coming from an angularjs world and something I was able to do before at first seemed to translate but after inspecting the network I'm getting multiple calls firing.</p>
  
  <p>In the anguylarjs I would of done something like this in a service:</p>
  
  <pre><code>function call(){
      if(service.promise){
          return service.promise
      };
      service.promise = http.get(...)
          .then(function(){
              ...
              return ...;
          }, function(){
              ...
          });
      return service.promise;
  }
  </code></pre>
  
  <p>To call it would be simple</p>
  
  <pre><code>call(); //fires the http call
  call(); //does not fire the http call again
  </code></pre>
  
  <p>I tried to replicate it with observables in angular but the http call always fires for each subscribe:</p>
  
  <pre><code>call(): Observable&lt;...&gt;{
      if(service.observable){
          return service.observable;
      }
  
      service.observable = this.httpClient.get&lt;...&gt;(...)
          .flatMap(data =&gt; {
              ...
              return of(...);
          });
  
      return service.observable;
  }
  </code></pre>
  
  <p>So if I subscribe too it twice it's always doing the http call</p>
  
  <pre><code>call() //fires the http call
      .subscribe((data) =&gt; {
          console.log(data);
      })
  call() //fires the http call again
      .subscribe((data) =&gt; {
          console.log(data);
      })
  </code></pre>
  
  <p>I could also be doing an anti-pattern here.</p>