Angular2 .subscribe有时不火的router.navigate

Question

我有一个登录功能：

login(user: UserComponent) { 
let headers = new Headers(); 
headers.append('Content-Type', 'application/json'); 
headers.append("Authorization", "Basic " + btoa(user.username + ":" + user.password)); 
return this._http 
    .get(
    'https://api.xxxxxxxxxxxx.com/rest/auth', 
    { headers } 
) 
    .map(res => res.json()) 
    .subscribe(
    (data) => { 
     this.loggedIn = true; 
     console.log('data '+ this.loggedIn); 
     localStorage.removeItem('auth_token'); 
     localStorage.setItem('auth_token', data.token); 
     console.log(data.token); 
     this._router.navigate(['']); 
    }, 
    (err) => { 
     this.errorMsg = err.json().error_message 
     console.log(this.errorMsg); 
    } 
);} 

isLoggedIn() { 
    if(this.loggedIn){ 
     return true; 
    }else{  
     this._router.navigate(['login']); 
     return false; 
    } 
    } 

，我称之为是这样的：

constructor(private _userService: UserService, private _router: Router) {} 

authUser() { 
    let user = new UserComponent(this.username, this.password); 
    this._userService.login(user); 

}

的CanActivate是这样这个：

@Injectable() 
export class LoggedInGuard implements CanActivate { 
    constructor(private _userService: UserService) {} 

    canActivate() { 
    console.log(this._userService.isLoggedIn()); 
    return this._userService.isLoggedIn(); 
    } 

} 

更新＃1 我想我找到了问题，但不知道如何解决。我用当前版本更新了上面的代码。

看起来像问题是当它执行警卫运行之前this.loggedIn被设置为真的行动....返回false然后......为什么？我该如何解决？

谢谢

Answer 1

您登录功能异步，这就是为什么console.log发生您从服务中获得的数据之前。您需要包裹console.log你登录函数来查看数据

this._userService.login(user).subscribe(
    (data) =>{ 
    this.data = data 
    console.log(this.data); 
    }, 
(err) => this.errorMsg = err.json().error_message);