title: Cleaner way of subscribing to the actions stream with NGXS
body: <p>So I'm usually having a method that dispatches an action on click:</p>
  
  <pre><code>create() {
    this.store.dispatch(new Create(this.form.value)); 
  }
  </code></pre>
  
  <p>this code triggers the following scenario and dispatches a CreateSuccess or CreateFailed depending of if the request failed or not</p>
  
  <pre><code>@Action(Create)
  create({ dispatch }: StateContext&lt;StateInterface&gt;, { entity}: Create) {
    return this.http.post('mybackend', entity).pipe(
      tap&lt;EntityType&gt;(resp =&gt; dispatch(new CreateSuccess(resp))),
      catchError(error =&gt; dispatch(new CreateFailed(error)))
    ); 
  }
  </code></pre>
  
  <p>Now inside the Component where I called the <code>create()</code> I'm listening for those two actions.</p>
  
  <pre><code>this.actions$.pipe(
    ofActionSuccessful(CreateSuccess, UpdateSuccess),
    takeUntil(componentDestroyed(this)) // &lt;--
  ).subscribe(action =&gt; doStuff());
  </code></pre>
  
  <p>This all works flawlessly, the only thing that bothers me is that every time I use this, I have to add the takeUntil() part so the subscription is cancelled when the component is destroyed.</p>
  
  <p>I know this is probably not a real issue for everyone, but I'd like to know if there is a cleaner way to do this.</p>
  
  <p>I've thought about a custom RxJS operator that could handle this, but maybe there are other options, or (something I haven't found anything about), is there a way that NGXS does the unsubscribing itself?</p>