Handle error response OK

import { Injectable } from '@angular/core';
import { HttpClient, HttpResponse } from '@angular/common/http';
import { HttpHeaders } from '@angular/common/http';
import { Login } from './login';
import { Observable, of } from '../../../node_modules/rxjs';
import { ConfigService } from '../config/config.service';
import { HttpErrorHandlerService, HandleError } from '../services/http-error-handler.service';

const httpOptions = {
  headers: new HttpHeaders({
    'Content-Type':  'application/json; charset=utf-8'
  })
};
@Injectable({
  providedIn: 'root'
})
export class LoginService {

   auth : Login ;
  // model = new Login('paul','paul');
  // private handleError: HandleError;

  constructor(
    private http:HttpClient,
    protected configService : ConfigService,
    httpErrorHandler :HttpErrorHandlerService
  ) { 

  }


  login(username: string, password: string): Observable<Login>{
    return this.http.post<Login>(`https://localhost:44358/api/Employee?username=${username}&password=${password}`,{username: username, password: password},httpOptions)

  }
}

export interface Login {
    username: string;
    password: string;
  }

import { Component, OnInit , Injectable} from '@angular/core';
import {ConfigService} from '../config/config.service';
import { Login } from './login';
import { FormBuilder, FormGroup, Validators} from '../../../node_modules/@angular/forms';
import { LoginService } from './login.service';
import { Router, ActivatedRoute, NavigationStart  } from '../../../node_modules/@angular/router';
import { AlertService } from '../alert-message/alert.service';
import { Subject } from '../../../node_modules/rxjs';

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

  loginForm: FormGroup;
  submitted = false;
  returnUrl: string;

  employees : Login[];
  editEmployee : Login;

  //error: string = '';

  private subject = new Subject<any>();
  private keepAfterNavigationChange = false;
  


  constructor(
    private configService:ConfigService,

    private formBuilder: FormBuilder,
    private loginService: LoginService) {  


                router.events.subscribe(event => {
                    if (event instanceof NavigationStart) {
                        if (this.keepAfterNavigationChange) {
                            // only keep for a single location change
                            this.keepAfterNavigationChange = false;
                        } else {

                            this.subject.next();
                        }
                    }
                });
    }


  ngOnInit() {
    this.loginForm = this.formBuilder.group({
                  username: ['', Validators.required],
                  password: ['', Validators.required]
    });
  }

      get f() {
        return this.loginForm.controls;
      }

      Authenticationtwo(username : string , password : string){
        this.editEmployee = undefined ;
        username = this.f.username.value.trim();
        password = this.f.password.value.trim();
        if(!username){
          return ; 
        }
        if(!password){
          return ; 
        }

        this.loginService.login(username,password).subscribe(
          auth => {
            console.log("yeah")
            console.log(username+password);
          },
          error => {
            console.log(error);
          }
        )
      }

}

<div class="border_gray">
  <h3>Connectez-vous</h3>
<form (ngSubmit)="Authenticationtwo()" [formGroup]="loginForm">

    <div class="form-group">
        <label for="username">Nom d'utilisateur</label>
        <input type="text" class="form-control" placeholder="Identifiant" id="username" formControlName="username" [ngClass]="{ 'is-invalid': submitted && f.username.errors }">
        <div *ngIf="submitted && f.username.errors" class="invalid-feedback">
            <div *ngIf="f.username.errors.required">Username is required</div>
        </div>
    </div>

    <div class="form-group">
        <label for="password">Mot de passe</label>
        <input type="password" class="form-control" placeholder="Mot de passe" id="password" formControlName="password" [ngClass]="{ 'is-invalid': submitted && f.password.errors }">
        <div *ngIf="submitted && f.password.errors" class="invalid-feedback">
            <div *ngIf="f.password.errors.required">Password is required</div>
        </div>
        
    </div>

    
    <button type="submit" class="btn btn-primary col-md-offset-4 col-md-4 col-md-offset-4">Submit</button>
</form>


</div>