javascript - 为什么不更改auth.guard中的值？

我有一个变量loggined，可使用logTog()方法更改其值。在这种方法中，我向服务发送请求，并在其中传输当前结果to auth.guard。在控制台中“未定义”为什么以及如何解决？

AppComponent的代码：

export class AppComponent implements OnInit {
    loggined: boolean = false;

    constructor(private galleryService: GalleryService) {}

    ngOnInit() {
        this.logTog();
    }

    logTog(): void {
        this.loggined = !this.loggined;
        this.galleryService.auth(this.loggined);
    }
}

服务：

    auth(log:boolean):boolean {
        console.log(log);
        return log;
    }

守护：

export class AuthGuard implements CanActivate, OnInit {
  constructor(private galleryService: GalleryService) {}
  canActivate(
    next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
    return this.galleryService.auth();
  }
  ngOnInit() {

  }
}

最佳答案

您可以提供服务以访问AppComponent和AuthGuard中的this.loggedIn的值。无需在AppComponent中声明this.loggedIn变量，而是在服务中声明它。

LoggedInService

import { Injectable } from '@angular/core';

@Injectable()
export class LoggedInService {

  constructor(
    private router:Router
  ) { }

  private loggedIn;

  setLoggedIn(data){
   // Change Value of this.loggedIn to true or false according to your logic
  }

  getLoggedIn(){
   return this.loggedIn;
  }

}

App.component.ts

export class AppComponent implements OnInit {


  constructor(private galleryService: GalleryService,
            private loggedInService: LoggedInService
  ) {}

  ngOnInit() {
    this.logTog();
  }

  logTog(): void {
    this.loggedInService.loggedIn = !this.loggedInService.loggedIn;
    this.galleryService.auth(this.loggedInService.loggedIn);
  }
}

auth文件根据您的逻辑保持不变

//相同的代码

守卫

export class AuthGuard implements CanActivate, OnInit {
  constructor(private galleryService: GalleryService,
              private loggedInService: LoggedInService
  ) {}
  canActivate(
    next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
    return this.galleryService.auth(this.loggedInService.loggedIn);
  }
  ngOnInit() {

  }
}