Tengo un formulario login de Administrador con email y password. Cuando se ingresan estos datos,
utilizo el servicio authService.getAdmin(email, password)
, este servicio envia los datos a NodeJs
para comprobar si el admin existe, si existe me devuelve los datos del admin.
Cuando Angular
recibe la respuesta de que existe el admin, redirige automaticamente a la view de administrador admin-principal
.
Hasta este punto lo pude lograr. El problema esta en que ahora, esa view admin-principal
esta protegida con un Guardian
,
y lo que necesitaria lograr es que, cuando Angular
sepa de que el admin existe, el guardian me permita acceder a la view.
aca mi app-routing.module.ts
donde tengo el Guardian
en el path: admin-principal
import { AdminGuard } from './admin.guard';
const routes: Routes = [
{
path: 'admin-login',
component: AdminLoginComponent
},
{
path: '',
component: AdminLayoutComponent,
children: [
{
path: '',
redirectTo: 'admin-principal',
pathMatch: 'full',
},
{
path: 'admin-principal',
canActivate: [AdminGuard],
component: AdminPrincipalComponent
},
]
},
];
Aca mi guardian admin.guard.ts
canActivate(
route: ActivatedRouteSnapshot,
state: RouterStateSnapshot): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree {
return false;
}
aca mi servicio auth.service.ts
API = 'http://localhost:4000/admin/login';
constructor(private http: HttpClient) { }
getAdmin(email: string, pass: string) {
const state: boolean = true;
// console.log(state, email, pass);
return this.http.post<Admin[]>(this.API, {email, pass, state});
}
aca mi admin-login.component.ts
export class AdminLoginComponent implements OnInit {
form: FormGroup;
admin = {} as Admin;
adminExist: boolean = true;
constructor(
private formBuilder: FormBuilder,
// public adminService: AdminService,
private authService: AuthService,
private router: Router
) {
this.buildForm();
}
ngOnInit(): void {
}
buildForm() {
this.form = this.formBuilder.group({
email: ['', [Validators.required, Validators.maxLength(50)]],
password: ['', [Validators.required, Validators.maxLength(50)]],
});
}
login(event: Event){
event.preventDefault();
if (this.form.valid){
const email = this.form.get('email').value;
const pass = this.form.get('password').value;
this.authService.getAdmin(email, pass)
.subscribe(admin => {
// si no obtuvo el admin
if (admin.length === 0){
this.adminExist = false;
console.log('no existe el administrador');
}
else{
console.log(admin);
sessionStorage.setItem('adminEmail', admin[0].email);
this.router.navigateByUrl('admin-principal');
}
});
}
}
aca el formulario en admin-login.component.html
<form [formGroup]="form" (ngSubmit)="login($event)">
<div class="form-group">
<input type="email" class="form-control" formControlName="email" (ngModelChange)="adminExist = true" placeholder="@email">
</div>
<div class="form-group">
<input type="password" class="form-control" formControlName="password" (ngModelChange)="adminExist = true" placeholder="password">
</div>
<button type="submit" class="btn btn-primary table">Login</button>
</form>
<div *ngIf="!adminExist">
<p class="text-center text-danger">No existe el administrador</p>
</div>