What are decorators in Angular? What are the different types?

Question

Accepted Answer

Decorators are special TypeScript functions (prefixed with @ ) that attach metadata to classes, properties, methods, or parameters. Angular uses them everywhere to wire up DI and the framework. Class decorators — @Component , @NgModule , @Directive , @Pipe , @Injectable ; mark the class's role. Property decorators — @Input() , @Output() , @ViewChild() , @ContentChild() ; bind class fields to the template/DOM. Method decorators — @HostListener() , @HostBinding() ; tie methods/properties to host element events and attributes. Parameter decorators — @Inject() , @Optional() , @Self() , @SkipSelf() , @Host() ; control DI behavior on constructor params. Compile-time — the Angular compiler reads decorators to generate factory code. Bucket them: **class** (`@Component`, `@Injectable`), **property** (`@Input`, `@Output`), **method** (`@HostListener`), **parameter** (`@Inject`). All ride on `reflect-metadata` for DI.