Executing code after dispatch is completed while using ngrx

In my sample Angular 2 application , I am using ngrx/store and ngrx/effects for state management.

Below is one of the function in a component to add a new item.

addAuthor() {

this.store.dispatch(addAuthorAction(this.fg.value));
console.log('2')
}


In the above code this.store.dispatch(addAuthorAction(this.fg.value)); takes care of making an AJAX call to server and adding a new author to database, which is working fine.

And because this.store.dispatch(addAuthorAction(this.fg.value)); is an async action , console.log("2") statement gets executed even before the AJAX call is completed.

My question is , what needs to be modified so that console.log gets executed after store.dispatch is done.

Continue reading...