Estoy haciendo un servicio de autentificación, si es correcto te permite seguir, pero sino, te puede sacar varios mensajes, El problema es que no sé como llevarme las variables del servicio al componente para que lo pueda mostrar en la vista.
Servicio :
export class DataService {
public errorMessage: string;
public showAlert: boolean = false;
public checkCredentials(url:string, username:string, password:string):Observable<any>{
return this.http.get<Object>(url).pipe(tap (users => {
const checkCookie = this.cookie.get('login');
if (users.find(u => u.user === username)) {
this.usuario = users.find(u => u.user === username);
if (username === this.usuario.user && password === this.usuario.pass && !checkCookie) {
this.cookie.set('login', this.usuario.mail);
this.router.navigate(['configuration']);
} else {
this.errorMesssage = 'Se han introducido unas credenciales incorrectas';
this.showAlert = true;
}
} else {
this.errorMessage = 'El usuario introducido no se ha encontrado';
this.showAlert = true;
}
return this.errorMesssage;
}));
1º Aquí tengo que enviar el Mensaje y el boolean y sólo tengo un return.
2º Además da error else {
this.errorMesssage = 'Se han introducido unas credenciales incorrectas';
El error es :
La propiedad "errorMesssage" no existe en el tipo "DataService". ¿Quería decir "errorMessage"?
3º Cómo recibir los returns del servicio en el componente.
const url = 'assets/users.json';
this.service.checkCredentials(url,this.username,this.password).subscribe();
Editado -->
Servicio :
public checkCredentials(url:string, username:string, password:string):Observable<any>{
return this.http.get<Object>(url).pipe(tap (users => {
const checkCookie = this.cookie.get('login');
let messageError = { message:"", showAlert:false };
if (users.find(u => u.user === username)) {
this.usuario = users.find(u => u.user === username);
if (username === this.usuario.user && password === this.usuario.pass && !checkCookie) {
this.cookie.set('login', this.usuario.mail);
this.router.navigate(['configuration']);
} else {
messageError.message = "Se han introducido unas credenciales incorrectas";
messageError.showAlert= true;
}
} else {
messageError.message = "El usuario introducido no se ha encontrado";
messageError.showAlert= true;
}
return messageError;
}));
}
Component
public checkCredentials = function () {
const url = 'assets/users.json';
this.service.checkCredentials(url, this.username, this.password).subscribe(result => {
console.log('result', result); //Devuelve a los usuarios
this.errorMessage = result.message;
this.showAlert = result.showAlert;
});
}
Si en vez de usar tap uso map, salta un error en el find o eso o todo el código se pone en rojo