AngularJSとRxJS canActivateを使った対象頭痛

Question

firebaseを使ったAngularJS2プロジェクトのサンプルがあります。 authServiceはisAuthenticatedatedメソッドをsubjectで使用しています。これはsubject.asObserveableを返します。購読すると、ヘッダ成分コンストラクタで

• それはcanActivateの最初の（）とルータガードで可変

• に返された値を渡し：

  方法は二回呼び出されます。 サンプルプロジェクトは正常に動作します。

私は自分のものでFirebaseAPIせずにそれをreworteとヘッダ・コンポーネントに期待どおりに動作しますが、ルータガードに私はいつも戻って空のオブジェクトを取得します。私が例のプロジェクトのように使用すると、ルータは動作を停止するので、何が起こるかを見るために変更しました。 これはのAuthServiceからコードである：

isAuthenticated() { 
const state = new Subject<boolean>(); 
state.subscribe(x => console.log('Subject start: ' + x)); 
this.localStorageService.observe('myToken') 
    .subscribe((newToken: MyToken) => { 
    console.log('localStorageCheck: ' + JSON.stringify(newToken)); 
    if ((newToken !== null) && (newToken.token !== '')) { 
     state.next(true); 
    } else { 
     state.next(false); 
    } 
    console.log('state changed'); 
    }); 
state.subscribe(x => console.log('Subject subscribe: ' + x)); 
return state.asObservable(); 

}

、これは番目のガードのコードである：

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) { 
let pass: boolean = false; 
const val = this.authService.isAuthenticated().first(); 
val.subscribe((x:boolean) => { 
    console.log('Guard says: ' + x); 
    pass = x; 
}); 
// return val; 
return pass; 

}

例プロジェクトだけがありますこれを返します.authService.isAuthenticated（）。first（）; 私は論理の違いを見ることはできませんし、理解したい、私はここで紛失している。

ありがとうございます

psまた、ガードでの作業のコードは次のようになります。私は観察することができますいくつかのより多くのテストの後

isAuthenticated() { 
const state = new Subject<boolean>(); 
firebase.auth().onAuthStateChanged(function(user) { 
    if (user) { 
    state.next(true); 
    } else { 
    state.next(false); 
    } 
}); 
return state.asObservable(); 

}

、その主題は私のプロジェクトで更新されており、これが起こらないとすぐにcanActivate実行（ただし、件名もそこで更新されます）。唯一の違いは、この例ではFirebaseのオブザーバを使用し、ng2-webstorageのオブザーバを使用している点です。私はもちろんcanActivateの外にあるprivate varを設定することでこれを回避することができ、これが動作します。

私は本当にこの別のバハビールの理由を理解したいと思います。誰かが私をelenenすることを望む、ありがとう。

Answer 1

あなたはブールが、canActivate方法で観察や約束だけでなく、を返すことができます：

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> { 
    return this.authService.isUserAuthenticated.isAuthenticated(); 
}