Problem with sending data by post, router error - angular7

Question

I can't send data to backend I don't know why, the problem in the console looks like that exactly at the login and register component this same issue is appearing. Maybe the ngsubmit is formated wrong but I don't know how to post the (ngSubmit)="onSubmit(f)" by the patter that it needs to represent.
This is the error in the console and the components which I'm using.
TypeError: Cannot set property 'router' of undefined
at AuthInceptor (auth.interceptor.ts:11)
at eval (module.ngfactory.js? [sm]:1)
at _callFactory (core.js:21283)
at _createProviderInstance (core.js:21237)
at resolveNgModuleDep (core.js:21198)
at NgModuleRef_.push../node_modules/#angular/core/fesm5/core.js.NgModuleRef_.get
auth.service.ts
constructor(private router: Router, private httpClient: HttpClient) {}
LogIn(email: string, password: string) {
const reqHeader = new HttpHeaders({'Content-Type': 'application/json', 'No-Auth': 'True'});
return this.httpClient.post<any>(this.apiAddress + 'account/login', {
Email: email,
Password: password
}, {headers: reqHeader})
.catch((e: any) => Observable.throw(this.errorHandler(e)));
}
Register(name: string, email: string, password: string, role: string) {
const reqHeader = new HttpHeaders({'Content-Type': 'application/json', 'No-Auth': 'True'});
return this.httpClient.post<any>(this.apiAddress + 'account/register', {
Name: name,
Email: email,
Password: password,
Role: role
}, {headers: reqHeader})
.catch((e: any) => Observable.throw(this.errorHandler(e)));
}
errorHandler(error: any): void {
console.log(error);
}
auth.inceptor.ts
constructor(private router: Router) { }
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
if (req.headers.get('No-Auth') === 'True') {
return next.handle(req.clone());
}
if (localStorage.getItem('userToken') != null) {
const clonedreq = req.clone({
headers: req.headers.set('Authorization', 'Bearer ' + localStorage.getItem('userToken'))
});
return next.handle(clonedreq)
.do(
succ => { },
err => {
if (err.status === 401) {
this.router.navigate(['/login']);
}
}
);
} else {
this.router.navigate(['/login']);
}
}
log-in form
<form class="example-form" (ngSubmit)="onSubmit(email.value, password.value)" #f="ngForm">
<mat-card-content>
<table class="example-full-width" cellspacing="0">
<tr>
<td>
<mat-form-field class="example-full-width">
<input matInput placeholder="Email" #email ngModel name="email" required>
</mat-form-field>
</td>
</tr>
<tr>
<td><mat-form-field class="example-full-width">
<input matInput placeholder="Password" #password ngModel type="password" name="password" required>
</mat-form-field></td>
</tr></table>
</mat-card-content>
<mat-card-actions>
<button mat-raised-button type="submit" color="primary">Login</button>
<div *ngIf="isLoginError" class="red-text center error-message">Error Incorrect email or password</div>
</mat-card-actions>
</form>
Submit function
onSubmit(email, password): void {
this.authService.LogIn(email, password)
.subscribe((data: any) => {
localStorage.setItem('userToken', data.token);
localStorage.setItem('role', data.role);
this.router.navigate(['../Home']);
console.log(data);
},
(err: HttpErrorResponse) => {
this.isLoginError = true;
});
}