Angular 1: ¿Qué es Angular? Tu primer componente standalone
easy⏱ 5 mincourseangular
Componentes standalone: sin NgModule
Los componentes modernos de Angular declaran standalone: true y listan lo que necesitan directamente en un array imports — sin necesidad de configurar un NgModule. Un componente decorado con @Component({...}) combina un selector (la etiqueta HTML que otros templates usan para renderizarlo), un template (inline o en un archivo separado), y la clase en sí, que contiene el estado y la lógica del componente.
import { Component, signal } from '@angular/core';
@Component({
selector: 'app-counter',
standalone: true,
template: `<button (click)="count.update(c => c + 1)">{{ count() }}</button>`,
})
export class CounterComponent {
count = signal(0);
}
La clase es el cerebro del componente
Todo lo que el template necesita — datos, métodos, valores calculados — vive como miembros de la clase del componente. Angular crea una instancia de la clase por cada componente renderizado y evalúa el template contra esa instancia, así que count en el template se refiere a this.count en la clase.
Construí ProfileCard
Declará un campo views con signal(0), y un botón cuyo handler (click) llame a this.views.update(v => v + 1). Mostrá el contador de vistas en el template con {{ views() }}.