5

redux(ngrx) を使用して「認証アプリ」を作成しようとしており、シークレット ガードでアプリの状態を使用しようとしています。ここで私の github を見ることができます: https://github.com/tamasfoldi/ngrx-auth/tree/router これは私のガードがどのように見えるかです:

@Injectable()
export class SecretGuard implements CanActivate {
  constructor(private store: Store<AppState>, private router: Router) {
  }
  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> {
    return this.store.let(getLoginState())
      .map(state$ => state$.isLoggedIn)
  }
}

ルーターがプロミスとオブザーバブルを解決するため、問題ないはずの isLoggedIn 属性を返しますが、秘密の部分に移動すると、ルーターがそれをブロックします。ここに私のルートがあります:

export const appRoutes: Routes = [
  {
    path: '',
    redirectTo: 'auth',
    pathMatch: 'full'
  },
  {
    path: 'auth',
    children: [
      { path: '', redirectTo: 'login', pathMatch: 'full' },
      { path: 'login', component: LoginComponent },
      { path: 'register', component: RegisterComponent }
    ]
  },
  {
    path: 'secret',
    canActivate: [SecretGuard],
    children: [
      { path: '', redirectTo: 'default', pathMatch: 'full' },
      { path: 'default', component: DefaultSecretComponent }
    ]
  }
];

redux では init 状態を受け取ったので、オブザーバブルの最初の放出をスキップしようとしましたが、どちらも機能しません。スキップコードは次のとおりです。

@Injectable()
export class SecretGuard implements CanActivate {
  constructor(private store: Store<AppState>, private router: Router) {
  }
  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> {
    return this.store.let(getLoginState())
      .skip(1)
      .map(state$ => state$.isLoggedIn)
  }
}

AuthService の認証機能を使用すると、正しく機能しますが、その解決策は「redux のような」ものではありません。ngrx で動作させる方法を教えてください。または、ガードで appstate を使用できませんか?

4

1 に答える 1