Guards funcionales en Angular

Los guards funcionales en Angular son una forma de proteger las rutas de tu aplicación y garantizar que solo los usuarios autorizados puedan acceder a ciertas secciones. Estos guards se implementan como funciones que devuelven un valor booleano o un observable que indica si se permite o no el acceso a la ruta.

¿Cómo funciona?

Los guards funcionales se pueden implementar utilizando el router de Angular y se pueden aplicar a nivel de ruta o a nivel de componente. Para crear un guard funcional, debes implementar la interfaz CanActivate y definir el método canActivate, que contiene la lógica para determinar si se permite el acceso a la ruta.

import { Injectable } from "@angular/core";
import {
  CanActivate,
  ActivatedRouteSnapshot,
  RouterStateSnapshot,
} from "@angular/router";

@Injectable({
  providedIn: "root",
})
export class AuthGuard implements CanActivate {
  canActivate(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot
  ): boolean {
    // Lógica para verificar si el usuario está autenticado
    return true; // o false si no está autorizado
  }
}

Vídeo completo: Guards funcionales en Angular

Únete a la comunidad

¿Te ha gustado el contenido? No olvides suscribirte a las redes de la comunidad de Programación en español

¿Quieres apoyar el contenido del canal de YouTube? Hazte miembro del canal entrando a este enlace.