Hi i have used anchor tag for opening the routerLink in new tab. Now if i click on logout, the routerLink in the new tab remains same, if there is any API hit then the routerLink redrirects to login page. But i want all the tabs to close as soon i logout, as the other router pages doesnt have header in the screen.
Header.component.ts:
public logout() {
this.authservice.logOutSuccess(true);
this.router.navigate(["/login"]);
this.cookieService.delete(TPIConstants.AUTH_TOKEN);
}
Here in the header component, if i click on logout i am clearing the cookie, so the screen redirects to login page.
But in the landing page, i have add new button, when i click on that it opens the router in the new tab,
Landing.html:
<a class="btn btn-light" target="_blank" [routerLink]="['/profile']"> Add New</a>
Profile Screen opens in new Tab now.
So, i have used a common service called auth.service in which i have used subject
auth.service.ts:
public detectLogOutSubject = new Subject<any>();
logOutConfirmed$ = this.detectLogOutSubject.asObservable();
logOutSuccess(value) {
this.detectLogOutSubject.next(value);
}
so when i click on logout, it comes to the authservice and triggers this event, and in profile page i have written like this in the constructor method
profile.component.ts: and app.component.ts
constructor(){
this.subscription = this.authService.logOutConfirmed$.subscribe(
res => {
alert(res)
});
}
Profile.html:
<div>
<button class="btn btn-secondary" onclick="window.close();" title="Close Window">
<i class="fas fa-times fa-1x"></i>
</button>
</div>
In profile html, i have the above div section, if that click triggered also, it will close the tab, but i am not able to get the event from logout function to profile screen/app.component also, i am struck, no where getting how to proceed