我的变量一直返回到默认布尔值,我的订阅不会从可观察对象中触发
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
而不是
您可以阅读更多关于差异的信息
我是 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
而不是
您可以阅读更多关于差异的信息