각도 2 관찰 가능 상태에서 인증 가드를 작동하는 방법

Question

내 경로 중 하나에 인증 가드를 구현하려고하는데 관찰 가능으로 수행하는 방법이 확실치 않아 작동하지 않습니다.

내가 저장 ngrx/store를 사용하여 내 토큰 다음 나는 (당신이 로그인하는 경우) 다음과 같습니다 객체 가져 this.store.select('auth'), 사용하여 페치 가드 :

{ 
    token: 'atokenstring', 
    isAuthenticated: true, 
    isPending: false 
} 

을 그리고 가드 외모 다음과 같이하십시오 :

export class AuthGuardService implements CanActivate { 

    constructor(private router: Router, private store: Store<IStore>) {} 

    canActivate(): Observable<any> { 

    return this.store.select('auth').let((state: Observable<IAuthStorage>) => state.filter((auth: IAuthStorage) => !auth.isPending && auth.isAuthenticated)).map(
     (auth: IAuthStorage) => { 

     if (!auth.isAuthenticated) { 
      return this.router.navigateByUrl('admin/login'); 
     } 
     else { 
      return true; 
     } 
     } 
    ); 
    } 
} 

이제는 가드가 부울 값이 아닌 관찰 가능 값을 반환하는 것으로 나타납니다. true을 반환하는 else 안에 들어가도 경로가 렌더링되지 않습니다.

가드가 관찰 가능이 아닌 부울 값을 반환하도록하려면 어떻게해야합니까? 이 여전히 사건이지만 라우터뿐만 아니라 완료 스스로 관찰을 위해, 하나 개의 이벤트 대기하는 동안이 같은 전에 뭔가

canActivate(): Observable<any> { 

    return this.store.select('auth').let((state: Observable<IAuthStorage>) => state.filter((auth: IAuthStorage) => !auth.isPending && auth.isAuthenticated)).map(
     (auth: IAuthStorage) => { 

     if (!auth.isAuthenticated) { 
      return this.router.navigateByUrl('admin/login'); 
     } 
     else { 
      return true; 
     } 
     } 
    ).first(); // <<<=== added 
    } 

필요한 경우

Answer 1

확실하지.

first을 가져와야합니다.