我的变量一直返回到默认布尔值,我的订阅不会从可观察对象中触发

My variable keeps returning to default boolean value and my subscription won't proc from an observable

我是 Angular/Node.js 的初学者,我正在做一个项目作为练习。 我在使用订阅和可观察对象时遇到了身份验证问题。

虽然我的身份验证有效,但我试图在身份验证成功时以视觉方式隐藏我的 login/signup 按钮,并改为显示注销按钮。

我正在使用“*ngIf="userIsAuthenticated"”来显示我的注销,并使用“*ngIf="!userIsAuthenticated"”来隐藏 signup/login 按钮。

在我的 authService class 文件中我有这个:

private authStatusListener = new Subject<boolean>();

constructor(private http: HttpClient, private router: Router) {}

getAuthStatusListener() {
return this.authStatusListener.asObservable();}

login(email: string, nickname: null, password: string ) {
const authData: AuthData = {
  email: email,
  nickname: nickname,
  password: password,
};
this.http
  .post<{token: string}>(BACKEND_URL + '/login', authData)
  .subscribe((response) => {
    const token = response.token;
    this.token = token;
    this.authStatusListener.next(true);
    this.router.navigate(["/"]);
  });}

在我的组件 .ts 文件中我有这个:

private authListenerSubs: Subscription;
userIsAuthenticated = false;

constructor(
private authService: AuthService,
public reviewService: ReviewService)

ngOnInit() {

this.authListenerSubs = this.authService
  .getAuthStatusListener()
  .subscribe((isAuthenticated) => {
    console.log('testing if this runs');
    console.log(this.userIsAuthenticated);
    this.userIsAuthenticated = isAuthenticated;
    console.log(this.userIsAuthenticated);
  });
console.log(this.userIsAuthenticated);
this.authListenerSubs = this.authService
  .getAuthStatusListener()
  .subscribe();}

我放了一堆 console.logs 来查看我的变量的行为。您可能还注意到看似无用的代码 this.authListenerSubs = this.authService .getAuthStatusListener() .subscribe(); 但是如果这段代码不在该代码之下,我订阅方法中的 none 日志将由于某种原因而不会执行,我不知道为什么会这样,也不知道这些事情是如何相关的。

主要问题是this.userIsAuthenticated不会更新。 我的日志说该值从应该的 false 开始,然后按照应该的方式更改为 true,但是当它完成订阅时,它会立即 returns 到 false 值,即使它不应该它已更改,但我无处可将其更改回 false。

谁能帮帮我?

Subject 不存储值。这就是为什么在每次订阅之后,这个过程就像从头开始一样。您应该使用 BehaviorSubject 而不是

您可以阅读更多关于差异的信息