How to create local effect in ngrx/effects

问题

How can I do something like that in ngrx/effects:

// I want to handle a sign up effect
return this.actions$.ofType(user.SIGN_UP_SUCCESS)
   .map((action: user.SignUpSuccessAction) => action.payload)
   .mergeMap(() => {
      // then I have to call two other async actions to add new records
      return [
         new userOptions.Add(new UserOptionsModel());
         new userInfo.Add(new UserInfoModel());
      ];
   })

How can I handle success actions for both userOptions and userInfo actions and then redirect to a Dashboard page? I don't want to redirect to the Dashboard page if I dispatch userOptions.Add and userInfo.Add actions outside user.SIGN_UP_SUCCESS sequence, from other pages for example.

ANSWER

Victor Savkin. State Management Patterns and Best Practices with NgRx https://www.youtube.com/watch?v=vX2vG0o-rpM

回答1:

You can use @ngrx/router-store:

return this.actions$.ofType(user.SIGN_UP_SUCCESS)
   .mergeMap(() => {
      // then I have to call two other async actions to add new records
      return [
         new userOptions.Add(new UserOptionsModel()),
         new userInfo.Add(new UserInfoModel()),
         go(['/path', { routeParam: 1 }], { query: 'string' });
      ];
   })

回答2:

2 options:

first:

return this.actions$.ofType(user.SIGN_UP_SUCCESS)
   .mergeMap(() => {
      // then I have to call two other async actions to add new records
      return [
         new userOptions.Add(new UserOptionsModel());
         new userInfo.Add(new UserInfoModel());
      ];
   })
   .map((action) => {
      if(action instanceof UserInfoModel){
        /// latest
      }
   })

second:

you can use map twice instead of mergeMap.

return this.actions$.ofType(user.SIGN_UP_SUCCESS)
       .map(toPayload)
       .map(() => {
          return new userOptions.Add(new UserOptionsModel());                 
       })
       .map(() => {
             return new userInfo.Add(new UserInfoModel());
       })
       .map(() => {
             //the end
       })

**** map(toPayload) do this: map((action: user.SignUpSuccessAction) => action.payload)

import { toPayload } from '@ngrx/effects'

have a nice day :-)

来源：https://stackoverflow.com/questions/44565464/how-to-create-local-effect-in-ngrx-effects

标签

angular