Angular2 @ ngrx/store/effects - 在哪里调用服务函数

Question

我正在使用@ ngrx/store和@ ngrx/effects制作一个Angular 2应用程序.

我正在努力理解将动作/效果等逻辑放在哪里以及调用服务功能的位置.

例如,通过身份验证......

1. 当用户单击login时AUTH_REQUEST,将使用登录凭据作为有效内容调度操作.
2. 效果会查找此操作并调用API.
3. 成功的结果AUTH_SUCCESS使用响应对象中的标记,用户名等调用该操作作为有效负载,该负载将转到reducer以更新AuthState.

例如:In AuthEffects

@Effect() authenticate$ = this.updates$
.whenAction(AuthActions.AUTHENTICATE_REQUEST)
.switchMap(update => this.api.post('/authenticate', update.action.payload)
  .map((res:any) => ({type: AuthActions.AUTHENTICATE_SUCCESS, payload: res.json()}))
  .catch((err:any) => Observable.of({ type: AuthActions.AUTHENTICATE_ERROR, payload: err }))
);

在 AuthReducer

 case AuthActions.AUTHENTICATE_SUCCESS:
  return Object.assign({}, state, <AuthState>{
    processing: false,
    failed: false,
    isLoggedIn: true,
    token: action.payload.token,
    username: action.payload.username,
    accountId: action.payload.accountId,
  });

我想知道的是:

1. 在AUTH_SUCCESS处理操作后,在何处调用路由器来更改页面.我是从效果反应链中做到这一点还是......？
2. 我有一个AuthService需要在LocalStorage中存储凭据(令牌等).我应该在哪里称之为"存储令牌"即authService.store(userCredentials).

任何帮助赞赏.

Answer 1

显然，这不是确定的答案；这就是我选择做的事情。

\n\n

CodeSequence /ngrx-\xe2\x80\x8c\xe2\x80\x8bstore-router实现 v3 路由器的操作。然而，它并没有实现动作创建者——只是实现了string类型。我使用了一个简单的动作创建器，这样我就不必到处都有动作文字：

\n\n

import * as ngrxStoreRouter from "ngrx-store-router";\n\n@Injectable()\nexport class RouterActions {\n\n    static NAVIGATE: string = ngrxStoreRouter.RouterActions.navigating;\n    navigate(url: string): Action {\n\n        return {\n            payload: { url },\n            type: RouterActions.NAVIGATE\n        };\n    }\n}\n

\n\n

我使用效果类来调度路由器操作：

\n\n

@Injectable()\nexport class RouterEffects {\n\n    ...\n\n    @Effect()\n    createUser(): Observable<Action> {\n\n        return this.stateUpdates_\n            .whenAction(AuthActions.CREATE_USER_SUCCESS)\n            .map((update) => update.action.payload)\n            .switchMap((payload) => {\n\n                return Observable.of(this.routerActions_.navigate("/on-board"));\n            });\n    }\n\n    ...\n}\n

\n\n

我的推理是，这不涉及对路由有任何了解的身份验证效果，它可以轻松编写路由器效果测试，并且路由器操作与 @ ngrx/store-devtools很好地契合。

\n\n

关于你的第二个问题，我倾向于将其与..._SUCCESS效果中的动作联系起来。

\n\n

我有兴趣了解替代方法。

\n