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

Beginner

Answer

Directives are classes that add additional behavior to elements in Angular applications. There are three types:

1. Component Directives: Components with templates
2. Structural Directives: Change DOM layout by adding/removing elements
3. Attribute Directives: Change appearance or behavior of elements

Examples:

<!-- Structural Directives -->
<div *ngIf="condition">Content</div>
<li *ngFor="let item of items">{{item}}</li>

<!-- Attribute Directives -->
<div [ngClass]="cssClass">Content</div>
<div [ngStyle]="styleObject">Content</div>