2016-10-27 13 views
0

私のAngular 2アプリが頻繁にサーバーに行く必要がないようにUser Profile Data Storeを構築しています。アプリケーションは現在、サービスを直接消費するときに正常に機能しますが、データストアレイヤーをその間に追加すると、observableは1回だけ(ナビゲーションバーコンポーネントが現在のuser.nameを読み込むと)発生します。サービスを使用するコンポーネントが動作しているように見え、AuthGuardが機能しなくなりました(UserProfileStoreを使用してユーザー情報を取得します)。私はSubjectを間違って使用していると思われます。または、の一部を使用する必要があります。BehaviourSubjectまたはReplaySubjectしかし、私は本当にどこから始めるべきかわかりません。私のコードはこの例の半分に基づいています:Cory Ryan Angular 2 Observable Data ServicesAngular2 DataStore - rxjsを使用しているときにauthGuardが機能しなくなった件名

私は行方不明のアイデアは何ですか?

ユーザーprofile.store.ts

@Injectable() 
export class UserProfileStore implements OnDestroy { 
private _currentUser:SjfrUser; 
private _currentUser$: Subject<MyAppUser>; 
private _subscription: Subscription; 

constructor(private authService: AuthService) { 
    this._currentUser$ = <Subject<MyAppUser>> new Subject(); 
} 

getCurrentUser =() : Observable<MyAppUser> => { 

    if (!this._currentUser) { 
     let currentUser$ = this.authService.getCurrentUser(); // Performs http 
     this._subscription = currentUser$.subscribe((currentUser: MyAppUser) => {     
      this._currentUser = currentUser; 
      this._currentUser$.next(this._currentUser); 
     }); 
    } 

    return this._currentUser$.asObservable(); 
} 

ngOnDestroy() { 
    this._subscription.unsubscribe(); 
} 

}

のAuth-Guard.service.ts

@Injectable() 
export class AuthGuard implements CanActivate, CanActivateChild, CanLoad { 
    constructor(private userProfileStore: UserProfileStore, private authService: AuthService, private router: Router) { } 

    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> {   

     let url: string = state.url; 

     //var currentUser$ = this.authService.getCurrentUser(); // Works with this 
     var currentUser$ = this.userProfileStore.getCurrentUser(); // No longer works    

     return currentUser$.map(x => { 
      console.log("AuthGuard" + x.userName); // This code no longer gets executed when using the datastore 
      if (x.isExternalUser && url === '/external') { 
       return true; 
      } else if (x.isInternalUser && url === '/internal') { 
       return true; 
      } else { 
       this.router.navigate(['/pagenotfound']); 
       return false; 
      } 
     });  


    } 
... 

答えて

0

(1次回でそれをやって試してみてください)の後地図

@Injectable() 
 
export class AuthGuard implements CanActivate, CanActivateChild, CanLoad { 
 
    constructor(private userProfileStore: UserProfileStore, private authService: AuthService, private router: Router) { } 
 

 
    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> {   
 

 
     let url: string = state.url; 
 

 
     //var currentUser$ = this.authService.getCurrentUser(); // Works with this 
 
     var currentUser$ = this.userProfileStore.getCurrentUser(); // No longer works    
 

 
     return currentUser$.map(x => { 
 
      console.log("AuthGuard" + x.userName); // This code no longer gets executed when using the datastore 
 
      if (x.isExternalUser && url === '/external') { 
 
       return true; 
 
      } else if (x.isInternalUser && url === '/internal') { 
 
       return true; 
 
      } else { 
 
       this.router.navigate(['/pagenotfound']); 
 
       return false; 
 
      } 
 
     }).first();  
 

 

 
    }

+0

これは機能しませんでした。また、消費者(オブザーバー)がデータストアの使用方法を変更する必要がないように、少しファサードを作成しようとしています。私はちょうどそれがサーバーを打つことなく定期的な観測のように振る舞いたい。 – ClaytonK

関連する問題