return for SwitchMap in Rxjs - Angular

Question

I'm using for the first time switchMap. It's telling me to return "something", but when I put a return it doesn't work.

 @Effect()
  subData$ = this.actions$.pipe(
    ofType(ActionTypes.SEARCH_SUB_DATA),
    map(action => action['payload']),
    switchMap(payload => { //Payload gets highlighted in red
      const repos = this.githubSearch.getRepos(payload);
      const followers = this.githubSearch.getFollowers(payload);
      const starred = this.githubSearch.getStarred(payload);
      return forkJoin([repos, followers, starred]).subscribe(results => {
        this.store.dispatch(
          new UserActions.SuccessSubData({
            user: payload,
            repos: results[0],
            followers: results[1],
            starred: results[2]
          })
        );
        return of(results);
      });
    })
  );

Argument of type '(payload: never) => Subscription' is not assignable to parameter of type '(value: never, index: number) => ObservableInput<{}>'. Type 'Subscription' is not assignable to type 'ObservableInput<{}>'.

UPDATE BASED ON ANSWER PROVIDED

@Effect()
      subData$ = this.actions$.pipe(
        ofType(ActionTypes.SEARCH_SUB_DATA),
        map(action => action['payload']),
        switchMap(payload => {
          return forkJoin(
            this.githubSearch.getRepos(payload),
            this.githubSearch.getFollowers(payload)
          );
        }).subscribe(results => {
          this.store.dispatch(
            new UserActions.SuccessSubData({
              user: payload,
              repos: results[0],
              followers: results[1]
            })
          );
        })
      );

Here's the picture showing the errors

image from error

KiraAG · Accepted Answer · 2019-05-23 02:47:22Z

1

@Effect()
  subData$ = this.actions$.pipe(
    ofType(ActionTypes.SEARCH_SUB_DATA),
    map(action => action['payload']),
    switchMap(payload => {
      return forkJoin(
        this.githubSearch.getRepos(payload),
        this.githubSearch.getFollowers(payload)
      ).pipe(map(([repos,followers]) => //return success action here), catchError(error => of(//return failaction))
    })
  )

Usually you don't have to subscribe, it will just return the stream and let ngrx handle the subscriptiona and unsubscription. SO here I am mapping success and failure callback actions. They will be automatically triggered by ngrx.

answered May 23, 2019 at 2:47

KiraAG

7835 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

KiraAG Over a year ago

Glad you found it useful.

Luillyfe · Accepted Answer · 2019-05-22 23:09:26Z

0

You are trying to merge an Observable with a Subscription and also when use forkJoin you are using with two undefined values. Code below must work for your case.

@Effect()
  subData$ = this.actions$.pipe(
    ofType(ActionTypes.SEARCH_SUB_DATA),
    map(action => action['payload']),
    switchMap(payload => {
      return forkJoin(
        this.githubSearch.getRepos(payload),
        this.githubSearch.getFollowers(payload)
      );
    })
  ).subscribe(results => {
      this.store.dispatch(
        new UserActions.SuccessSubData({
          user: payload,
          repos: results[0],
          followers: results[1]
        })
      );
    });

edited May 22, 2019 at 23:09

answered May 22, 2019 at 22:30

Luillyfe

6,9828 gold badges39 silver badges51 bronze badges

8 Comments

fuscode Over a year ago

Hola parce! thanks for the help. This didn't work. No every word 'payload' things is an object instead of a string and the .subscribre() is in red because aparently switchmap doesnt return an observable

Luillyfe Over a year ago

Yeah my bad, I edited the answer, I am pretty sure it must work now.

fuscode Over a year ago

still same issue. Idk if it makes a difference that I have the switchMap inside of an effect. I have updated my questions with your code and attached an image

Luillyfe Over a year ago

I just edited again, it turns out you have get rid of brackets in forkJoin.

fuscode Over a year ago

same error :( I have updated my questions with the code without brakets and udpated image too

|

Collectives™ on Stack Overflow

return for SwitchMap in Rxjs - Angular

2 Answers 2

1 Comment

8 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

8 Comments

Your Answer

Sign up or log in

Post as a guest

Related