DEV Community

Akhil Ashok
Akhil Ashok

Posted on

Login Menu hide

How to hide Login on Menu once a user is already logged in

Top comments (9)

Collapse
 
dreamcatcher8055 profile image
Akhil Ashok

I need to hide the login button based on login

Collapse
 
katnel20 profile image
Katie Nelson

Don't forget to show the button again when the user logs out

Thread Thread
 
dreamcatcher8055 profile image
Akhil Ashok

Ok do you know how to implement this?

Thread Thread
 
katnel20 profile image
Katie Nelson

For the same div that you did a display:none, do a display:block

Collapse
 
ankit199 profile image
Ankit kumar shukla

1) Add this to your service provider:-

import { Subject } from 'rxjs/Subject';

public isLogged= new Subject();
setIslogged(value: boolean) {
this.isLogged.next(value); //it is publishing this value to all the subscribers that have already subscribed to this message
}

2) For Login Page ****

import your service for the login page

inside your login method after subscription/successfully login publish is logged variable

this.yourservice.setIslogged(true);

and in your logout method

this.yourservice.setIslogged(false);

3) In Your NavBar Component
import your service for the NavBar Component
declare variable
isLogin:any;

ngOnInit() {
this.yourservice.isLogged.subscribe(
(isLoggeduser) => {
this.isLogin= isLoggeduser;
}
);
}

add a condition with *ngIf="isLogin" in your login button

Collapse
 
dreamcatcher8055 profile image
Akhil Ashok

šŸ‘

 
dreamcatcher8055 profile image
Akhil Ashok • Edited

How can i implement that

Thread Thread
 
dreamcatcher8055 profile image
Akhil Ashok

I need to hide the login button in navigation menu when user is loggedin

Some comments may only be visible to logged-in visitors. Sign in to view all comments.