Диспетчеризация действия во второй раз не действует в RxJS и Angular 6 - PullRequest
Новая
       38

Диспетчеризация действия во второй раз не действует в RxJS и Angular 6

0 голосов
/ 06 июля 2018

У меня есть @Effect, который управляет входом в систему. Шаги следующие:

  • Позвоните в службу
  • Сохранить токен (в класс);
  • Выберите магазин приложений, чтобы узнать, просил ли пользователь другую страницу (перед перенаправлением на страницу входа в систему. Потому что, возможно, он хотел перейти на страницу «профиля», но затем я перенаправил его на страницу входа в систему, сохранив нужную страницу «профиля»). ). В этом случае редирект пользователя
  • Выполнять другие действия (установить переменную isAuthenticated, сохранить токен, декодировать токен в хранилище).

Все работает. Это код auth.effects.ts : 

@Injectable()
export class AuthEffects {
    constructor(private store: Store<fromApp.AppState>, private actions$: Actions, private router: Router, private authService: AuthService, private route: ActivatedRoute, private toastr: ToastrService) {
    }
    tokenObj: { token: string };
    @Effect()
    authLogin$ = this.actions$
        .ofType(AuthActions.DO_LOGIN)
        .pipe(map((action: AuthActions.DoLogin) => {
            return action.payload;
        })
            , switchMap((authData: { email: string, password: string }) => {
                return from(this.authService.login(authData.email, authData.password));
            })
            , map(tokenObj => this.tokenObj = tokenObj) 
            , withLatestFrom(this.store.select(('core')))
            , take(1)
            , map(([action, storeState]) => {
                if (storeState.redirectUrl) {
                    this.router.navigate([storeState.redirectUrl]);
                } else {
                    this.router.navigate(['/']);
                }
            })
            , mergeMap(() => {
                return [
                    {
                        type: AuthActions.LOGIN 
                    },
                    {
                        type: AuthActions.SET_TOKEN,
                        payload: this.tokenObj.token
                    },
                    {
                        type: ProfileActions.DECODE_TOKEN,
                        payload: this.tokenObj.token
                    },
                    {
                        type: CoreActions.REMOVE_REDIRECT_URL
                    }
                ];
            })
            , catchError((err, caught) => {
                this.toastr.error(err.message);
                // Quindi, alla fine, torniamo l'Observable di errore, affinché si possa ri-provare l'operazione
                return caught;
            })
        );
}

Это функция внутри login.component.ts : 

 onLogin(form: NgForm) {
    const email = form.value.email;
    const password = form.value.password;
    this.store.dispatch(new AuthActions.DoLogin({ email: email, password: password }));
  }

Это функция, которая запускает выход из системы в header.component.ts : 

onLogout() {
    this.store.dispatch(new AuthActions.Logout());
    this.store.dispatch(new ProfileActions.CancelLoggedUser());
    this.router.navigate(['/login']);
}

Проблема : Если я выхожу из системы, я снова набираю адрес электронной почты и пароль, нажимаю логин и ничего не происходит. В частности, открывая Ngrx DevTools, я вижу, что DO_LOGIN отправляется (со значениями свойств формы), но сервер не вызывается. Событие, если я поставлю точку останова внутри эффекта, не сработает. Почему?

Это экран всех действий: Вход в систему ---> Домой ---> Выход из системы ---> Выполнить второй вход в систему: enter image description here

1 Ответ

0 голосов
/ 06 июля 2018

Проблемы возникли из take(1), который отменяет наблюдаемые эффекты.

Эффект ngrx является одноэлементным, после отмены подписки никогда не будет подписываться снова.

...