Angular Guard未触发路由

问题描述

我从输入中获取价值

onSubmit(form: NgForm) {
   this.sessionService.get(form.value.login,form.value.password);
 }

然后将它们与db值进行比较，如果它们是正确的。然后我要更新商店

get(login,password) {
    this.http.get<Auth>(url)
      .pipe(take(1),tap(data => {
        if (data.accounts.elisa.email === login || data.accounts.elisa.login === login && data.accounts.elisa.password === password) {
          this.sessionStore.update({isAuth: true});
        } 
      })).subscribe();
  }

并将isAuth发送给CanActivate卫队

canActivate(
    next: ActivatedRouteSnapshot,state: RouterStateSnapshot): Observable<boolean> {
    return this.sessionQuery.getStoreData$;
  }

主要问题是，如果值正确，我可以登录，但只能在第二次单击提交按钮时登录。第一次单击并将isAuth的值设置为true

后，商店正在正确更新

getStoreData$实施

export class SessionQuery extends Query<SessionState> {
  getStoreData$ = this.select(store => store.isAuth);

  constructor(protected store: SessionStore) {
    super(store);
  }
}

并存储配置

import { Injectable } from '@angular/core';
import { Store,StoreConfig } from '@datorama/akita';

export interface SessionState {
   isAuth: boolean;
}

export function createInitialState(): SessionState {
  return {
    isAuth: false
  };
}

@Injectable({ providedIn: 'root' })
@StoreConfig({ name: 'session' })
export class SessionStore extends Store<SessionState> {

  constructor() {
    super(createInitialState());
  }
}

解决方法

像这样尝试super(createInitialState())

function createInitialState(): SessionState { ... }

@Injectable({ providedIn: 'root' })
@StoreConfig({ name: 'session' })
export class SessionStore extends Store<SessionState> {
  constructor() {
    super(createInitialState());
  }
}

,

我已经找到了解决方案，希望我能帮助遇到同样问题的人=）

canActivate(
    next: ActivatedRouteSnapshot,state: RouterStateSnapshot): Observable<boolean> {
    return this.sessionQuery.getStoreData$.pipe(first(value => value === true));
  }