Definir ruta En este POST ya aprovechando el anterior en el que hicimos la configuración básica para que funcione el routing en Angular, vamos a definir una ruta para acceder al recurso y además añadirle el titulo a la página. Para hacer esto, lo que necesitamos identificar en primer lugar, es el archivo en el […]

Buenas! Hoy traigo un POST sobre la gestión básica del routing de Angular. ¿Qué es el Routing en Angular y cómo configurarlo paso a paso? El routing en Angular es la forma que tiene el framework para gestionar las rutas de acceso a los recursos que se le ofrecen al usuario. Por ejemplo: http://localhost:4200/ ->

Buenas! Hoy me dispongo a mostrar el como optimizar imágenes en Angular de una forma sencilla y fácil para el usuario. Para esto haremos uso de la directiva NgOptimizedImage que nos ofrece la posibilidad de optimizar las imágenes que subamos a nuestra página web. Para ello, los pasos que seguiremos serán los siguientes: optimizing-images.component.html optimizing-images.component.ts

Las deferrable views de Angular también conocidas como vistas diferibles permiten mejorar la experiencia de UI del usuario que visita nuestra página al cargar el contenido de la página cuando es realmente necesario. Para ello se hace uso del @defer en el que se introduce el contenido final que se va a mostrar al usuario,

Muy buenas! Hoy os vengo con un mini tutorial sobre cómo usar esa directiva llamada @Output que tiene Angular. Flujo: @Output, nos sirve para pasarle el estado de una propiedad de un componente hijo a un componente padre mediante eventos que emiten valores a través de la función emit de EventEmitter. Para realizar esta práctica

El manejo de eventos en Angular sirve para interactuar con el usuario que está visitando el sitio. Algunos de los eventos disponibles pueden ser: onmouseover, click, entre otros. Para usar estos eventos, usa la sintaxis: (evento)=»función()» A continuación un ejemplo sobre cómo manejar estos eventos: Tras ejecutar el código y pasar el cursor por encima

En Angular usamos las input properties para pasar datos a traves de atributos que estan vinculados a componentes. Esto nos sirve para usar datos de unos componentes en otros, algo similar a lo que ocurre con props en otros frameworks como react. Ejemplo:

Property binding es una técnica que Angular utiliza para asignar valores a atributos de HTML a través de propiedades de clase de Typescript. Esto permite actualizar dinámicamente propiedades del DOM. Ejemplo: Tras la ejecución del anterior código, el atributo contentEditable del div se establecerá en true y el div será editable. Esta práctica puede ser

el nuevo componente de control de flujo @for de angular, te permite iterar colecciones y mostrar el contenido en el template. En este ejemplo se puede ver como usarlo para mostrar cada propiedad name del json de users en un párrafo distinto utilizando la propiedad id para hacer seguimiento de cada elemento lo que optimiza

A veces debemos decidir que le mostramos y que no al usuario según unas propiedades. Angular nos permite hacer esto a través de @if, una directiva que nos permite decidir si mostrar o no cierto contenido según una expresión. Cabe mencionar que @if está disponible sólo en versiones de Angular superiores a la 17. Y