No hay comentarios 😮 pero es un excelente curso
Primeros pasos
Qué es Angular y cómo aprenderlo
Instalación de Angular CLI
Comandos de Angular para correr tu proyecto
Estructura de un proyecto en Angular
Conceptos básicos de TypeScript para usar Angular
Comunicación de datos
String interpolation
Property Binding
Introducción al Event Binding de Angular
Otros eventos que puedes escuchar
Data binding con ngModel
Estructuras de control
Uso de *ngIf
Uso de *ngFor
*ngFor para arrays
Uso de *ngSwitch
Angular Devtools
Estilos
Estilos a la lista de productos
Class and style
NgClass y NgStyle
Crear un formulario
Despedida
Continúa con el Curso de Angular: Componentes y Servicios
Deploy
Despliegue con Firebase Hosting
Aún no tienes acceso a esta clase
Crea una cuenta y continúa viendo este curso
Crear cuenta
Si ya tienes una cuenta,
Iniciar sesión
Class and style
17/21Recursos
Class binding
La versatilidad de Angular te permite agregar o quitar clases y estilos a tus elementos HTML a partir de condicionantes. Así como anteriormente utilizaste los corchetes [] para bindear atributos como el [src] de una imagen o el [href] de un enlace, puedes bindear clases para que Angular las agregue o quite dinámicamente si se cumple una condición de la siguiente manera:
<div [class.active-color]="isActive">
</div>
Imagina que tienes en tu componente una propiedad llamada isActive que agregará la clase active-color si esta es verdadera o quitará la clase si es falsa. Luego ya puedes darle los estilos que más te gusten al elemento HTML en tu hoja de estilos utilizando la clase active-color.
Style binding
También puedes añadir estilos inline a los elementos HTML bindeando la propiedad [style] seguido de la propiedad CSS que quieres modificar dinámicamente:
<p [style.color]="isActive ? 'blue' : 'red'"></p>
A partir del valor de isActive, dependiendo si este es verdadero o falso, puedes emplear un operador ternario para cambiar el color del párrafo.
Aporte creado por: Kevin Fiorentino.
Aportes 25
Preguntas 6
Ordenar por:
Creo que parte de que no haya comentarios, es el gran trabajo que hace el profesor en dar una explicacion tan clara, que practicamente no tienes ninguna duda pues se explica muy bien. Gracias Nico. Excelente Curso
No puede estar mejor desarrollado este curso… Felicitaciones
Para no confundirse un poco con la propiedad invalid en los estilos dinamicos también se puede validar el contenido del input
<p [style.font-style]="nameInput3.value === 'Hola' ? 'italic' : 'normal'">Estilo dinamico activado</p>
Este curso me ha hecho agarrarle amor a angular, excelente curso.
Modificando el color del texto en línea:
<label>Nombre</label>
<input type="text" required #nameInput3="ngModel" [(ngModel)]="person.name" />
<p [style.color]="nameInput3.invalid ? 'red' : 'white'">El campo es requerido</p>
estos estilos dinamicos son mas entendibles que styled-component
Que maravilla, un video que te explica el error, angular esta genial
El profe es un éxito, se entiende todo super fácil!
para ocultar contenido con css se recomienda usar display:none en lugar de opacity: 0 dado que display:none oculta todo el contendio sin dejar espacios visibles en el documento por contenido oculto. Para mostrarlo podrian usar display:block
Se recomienda que establezca una propiedad de elemento con un enlace de propiedad siempre que sea posible. Sin embargo, a veces no tiene una propiedad de elemento para enlazar. En esas situaciones, utilice el enlace de atributos.
El enlace de atributos en Angular lo ayuda a establecer valores para los atributos directamente. Con el enlace de atributos, puede mejorar la accesibilidad, diseñar su aplicación dinámicamente y administrar múltiples clases o estilos CSS simultáneamente.
Este curso me ayudo mucho
Este es el Curso de Angular Forms: Creación y Optimización de Formularios Web
https://platzi.com/cursos/angular-forms/
mucho desordern
Este curso me ha servido bastante en mi trabajo, es genial, aprendí el comportamiento real de Angular y su estructura.
Mil gracias profe.
Podría asegurar que eres el mejor profe de platzi, gracias !
He presentado varios exámenes algunos ganados otros perdidos, y he aprendido en ellos.
Lo que mejor aprendí es que un examen no te hace ni bueno ni malo, no quiere decir que aprendiste o no, pues he ganado exámenes y he tenido que regresar nuevamente a los videos a estudiar nuevamente cuando hago algo sin guía del profesor. Me parece que los exámenes sobran, es mejor crear un proyecto así sea pequeño por nuestra cuenta, así asimilamos lo estudiado. la vieja escuela evalúa con examenes.
Nicolas gracias, hace dos años que no aprendía angular y este curso esta buenísimo. Gran trabajo y convención de contenidos.
Excelente explicación. Ahora a practicar.
gracias a este curso antes me parecía complicado angular y prefería a React JS, pero ahora entiendo mas y me esta gustando mucho angular
Buen curso, recomendado
Jamas habia visto una explicación de Angular tan clara… Excelente profe.
Excelente video, quedaron muy claros los conceptos 🎃.
Muchas gracias Nicolas Molina, este curso está genial. Eres un capo!
¿Quieres ver más aportes, preguntas y respuestas de la comunidad? Crea una cuenta o inicia sesión.