how to subscribe to action success callback using ngrx and effects

Question

I'm trying to do simple thing - after some entity saved (using http request) I want to navigate back to list route. The problem is : how to subscribe to success action (or may be reducer or effect?)

here is my actions code:

static SAVE_POST = '[POST] Save POST'; savePOST(Post): Action {     return {         type: PostActions.SAVE_POST,         payload: Post     }; }  static SAVE_POST_SUCCESS = '[POST] Save POST Success'; savePOSTSuccess(Post): Action {     console.log('action: savePostSuccess')     return {         type: PostActions.SAVE_POST_SUCCESS,         payload:Post     }; } 

i'm using Effects:

   @Effect() savePost$ = this.update$     .ofType(PostActions.SAVE_POST)     .map(action => action.payload)     .switchMap(post => this.svc.savePost(post))     .map(post => this.postActions.savePOSTSuccess(post)); 

reducer:

const initialState: PostListState = [];  export default function (state = initialState, action: Action): PostListState {     switch (action.type) {         case PostActions.LOAD_POST_SUCCESS: {             return action.payload;         }         case PostActions.SAVE_POST_SUCCESS: {             console.log('SavePOST SUCCESS',action.payload)             let index = _.findIndex(state, {_id: action.payload._id});             if (index >= 0) {                 return [                     ...state.slice(0, index),                     action.payload,                     ...state.slice(index + 1)                 ];             }             return state;         }         default: {             return state;         }     } } 

in my component i want to subscribe to success callback:

   handlePostUpdated($event) {      this.post = this.code;      let _post: Post = Object.assign({}, { _id: this.id, name: this.name, text: this.post });      this.store.dispatch(this.postActions.savePOST(_post)); //not have "subscribe" method    } 

Thanks for Help

Answer 1

You can subscribe to actions in components as well:

[...] import { Actions } from '@ngrx/effects'; [...]  @Component(...) class SomeComponent implements OnDestroy {     destroyed$ = new Subject<boolean>();      constructor(updates$: Actions) {         updates$.pipe(            ofType(PostActions.SAVE_POST_SUCCESS),            takeUntil(this.destroyed$)         )         .subscribe(() => {            /* hooray, success, show notification alert etc.. */         });     }      ngOnDestroy() {         this.destroyed$.next(true);         this.destroyed$.complete();     } }