Before a user can post a message in the message form, they must first be logged in. If not, when they click the send message button, they will be redirected to the login page.
I attempted using route guards, but unfortunately, they are guarding all of the components!
Below is the HTML section:
<div class="modal-body">
<form role="form" #f="ngForm">
<!-- Validation email -->
<div class="form-group">
</div>
// Other form input fields...
<button type="submit" class="btn btn-success pull-right" (click)="sendMsg(f)">Send Message!</button>
</form>
</div>
Here is the TypeScript portion:
sendMsg(f: NgForm) {
if(this.loginService.loggedIn()){
const msg: Message = f.value;
msg.lu = false;
// Additional logic here
}
else{
alert('Please log in before sending a message');
this.router.navigate(['/login']);
}
In the app-routing module, I have used canActivate:[AuthGuard], which directs the user to the login page if they attempt to access the component. My goal is for the user to access the component and only be redirected to the login page when clicking the send message button.