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 我想我发现了问题，但不知道如何解决。我用当前版本更新了上面的代码。

看起来问题是它在执行Guard运行之前执行的操作。在this.loggedIn设置为true之前....返回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);

Angular2 .subscribe有时不会触发router.navigate

1 个答案: