NGRX - Actions may not have an undefined "type" property

Question

trying to get this ngrx @Effect to work with an http call.

  @Effect()
  loadPosts$ = this.actions$
    .ofType(post.ActionTypes.LOAD)
    .map(() => {
      return this.postService.get()
        .map(posts => {
          return new post.LoadSuccessAction(posts)})
        .catch(() => of(new post.LoadSuccessAction([])));
    })

If I swap in the following simple return it works

return new post.LoadSuccessAction([['one'], ['two']])

My postService get method is very simple

  get() {
    return this.http.get(`{this.API_PATH}/api/v1/en/posts?limit=10&offset=0`)
      .map(res => res.json());
  }

Not really sure what might cause this or where to look.

EDIT

LoadSuccessAction looks like this

export class LoadSuccessAction implements Action {
  type = ActionTypes.LOAD_SUCCESS;

  constructor(public payload: any[]) { }
}

Answer 1

Your service's result is an observable and returning that from the map operator in your composed effect sees the effect emit an observable - not an action.

The ngrx store interrogates the observable for a type property and, not finding one, effects the error you have mentioned.

RxJS contains several operators that will 'flatten' mapped observables into the composed observable. And the one you likely want is switchMap. The switchMap operator will subscribe to the returned observable and will emit its values into the composed observable's stream of values. Also, if another LOAD action occurs before a pending service call completes, the pending call's observable is unsubscribed and ignored - which is probably the behaviour you want.

If you don't want pending service calls ignored, you can use concatMap.