I have come across numerous questions similar to mine, however, the majority are linked to params. The answers provided did not aid in resolving my specific issue. Essentially, the problem I am facing is as follows: After a user logs in, their username is displayed in the navbar. When the user clicks on it, they should be taken to their profile page. Initially, this functionality works perfectly. However, when the user logs out and then logs back in with a different username, the information from the previous user remains visible unless the page is refreshed.
Service Account
getUserInformation(userId: number) {
if (!this.userInformation$) {
this.userInformation$ = this.http.post<any>(this.baseUrlGetUserInfo, { userId }).pipe(shareReplay());
}
return this.userInformation$;
}
OnInit Method
ngOnInit() {
this.route.params.subscribe(params => {
this.loaderSpinner = true;
// tslint:disable-next-line: radix
// this.userId = this.accntService.currentUserId;
// tslint:disable-next-line: radix
this.accntService.currentUserId.subscribe(res => {
this.userId = res;
});
// tslint:disable-next-line: radix
this.userInformation$ = this.accntService.getUserInformation(parseInt(this.userId));
this.userInformation$.subscribe(result => {
this.userInformation = result.userInformation;
console.log(this.userInformation);
this.loaderSpinner = false;
}, error => {
this.loaderSpinner = false;
console.error(error);
});
});
}
Navbar HTML
<a [routerLink]="['/profile']" class="nav-link" *ngIf="(userName$ | async) as userName">
{{userName}}
</a>
Could someone provide assistance with this issue?
Thank you in advance.