ExpressGrocery/angular_frontend/src/app/auth/login/login.component.ts

import { Component, OnInit } from '@angular/core';
import { FormControl, FormGroup, Validators } from '@angular/forms';
import { Router } from '@angular/router';
import { Account } from 'src/app/model/account.model';

import { AccountService } from 'src/app/service/account.service';

@Component({
  selector: 'app-login',
  templateUrl: './login.component.html',
  styleUrls: ['./login.component.css']
})
export class LoginComponent implements OnInit {

  loginForm: any;
  user : Account = new Account();
  msg: string;
  constructor(private route: Router, private accountService : AccountService) {
    this.msg = '';
   }

  ngOnInit(): void {
    this.loginForm = new FormGroup({
    username : new FormControl('',Validators.required),
    password : new FormControl('',Validators.required)
    
    });
  }
  OnLoginFormSubmit(){

    // this.accountService.getAccounts().subscribe(res=>{
    //   const user = res.find((a:any)=>{
    //     return a.username == this.loginForm.value.username && a.password == this.loginForm.value.password;
        
    //   });
    //   if(user){
    //     alert("Login Success");
    //     this.loginForm.reset();
    //     this.route.navigateByUrl('/home');
    //   }else{
    //     alert("user not found");
    //   }
    // },err=>{
    //   alert("Something went wrong!!");
    // })
    this.user = {
      username :this.loginForm.value.username,
      password :this.loginForm.value.password
    }
    this.accountService.login(this.user).subscribe((data: any)=>{
      window.sessionStorage.setItem("username",this.user.username);
      window.sessionStorage.setItem("isLoggedIn","true");
      this.route.navigateByUrl('/home');
    }),
   (err: any)=>{
      this.msg='Invalid credentials';
      window.sessionStorage.removeItem('username');
      window.sessionStorage.removeItem('isLoggedIn');
    };

  }

}