As a newcomer to Angular, I have been following the MEAN Stack - Mean Auth App Tutorial in Angular 2. However, since I am using Angular 8, some of the code is deprecated due to recent updates. I have encountered an issue with the code below and I'm unsure how to resolve it.
The code in my Auth.service.ts is functioning without errors:
authenticateUser(user){
let headers = new HttpHeaders();
headers.append('Content-Type','application/json');
return this.http.post('http://localhost:3000/users/authenticate', user,{headers: headers})
}
storeUserData(token, user){
localStorage.setItem('id_token', token);
localStorage.setItem('user', JSON.stringify(user));
this.authToken = token;
this.user = user;
}
logout(){
this.authToken = null;
this.user = null;
localStorage.clear();
}
In my login.component.ts, there's an error being displayed:
Property 'token' does not exist on type 'Object'
Property 'user' does not exist on type 'Object'
Property 'msg' does not exist on type 'Object'
This is the code from my login.component.ts:
onLoginSubmit(){
const user = {
username: this.username,
password: this.password
}
this.authService.authenticateUser(user).subscribe(data => {
if(data){
this.authService.storeUserData(data.token, data.user);
this.flashMessage.show('You are now logged in', {
cssClass: 'alert-success',
timeout: 5000});
this.router.navigate(['dashboard']);
} else {
this.flashMessage.show(data.msg, {
cssClass: 'alert-danger',
timeout: 5000});
this.router.navigate(['login']);
}
});
}
In my login.components.ts file, when I input incorrect login credentials, it still logs me in, which should not happen.
onLoginSubmit(){
const user = {
username: this.username,
password: this.password
}
this.authService.authenticateUser(user).subscribe(data => {
console.log(data);
if(user){
this.authService.storeUserData(data.token, data.user);
this.flashMessage.show('You are now logged in', {
cssClass: 'alert-success',
timeout: 5000});
this.router.navigate(['dashboard']);
} else {
this.flashMessage.show(data.msg, {
cssClass: 'alert-danger',
timeout: 5000});
this.router.navigate(['login']);
}
});
}