title: Dispatch second action after first action completes from component in NGRX/RXJS
body: <p>I am new to using NGRX/RXJS in my angular application, and I have a situation where I have to dispatch an action from my component, which fetches data from an API if the property is empty and updates Store_1 and set a property, and then dispatch another action which uses that data from Store_1 to perform some functions in Store_2 and update state after action 1 completes and fill in "pluralconfig". This is the code I came up with but I dont think/believe it's the most efficient way to  do this, and If I'm using the operators correctly.</p>
  
  <pre><code>  if(isEmpty(definition.pluralconfig == null))
       {
           this.store$.dispatch(new FormDBAction(definition.formId));
  
           let id = definition.id;
           this.formLoadSubscription = this.store$.select(getOrderById(id))
           .filter(v =&gt; v.pluralconfig != null).subscribe(() =&gt;{
  
              this.store$.select&lt;TosModel&gt;(getOrderById(id)).subscribe(updatedDefinition =&gt; {
                this.store$.dispatch(new OrderDetailAction(updatedDefinition));
              });             
           });
       }
       else{
        this.store$.dispatch(new OrderDetailAction(definition));
       }
  </code></pre>