Data Directives¶¶

Einführung¶¶

Data Directives in Angular sind Anweisungen, die das Verhalten von DOM-Elementen anpassen. Sie werden genutzt, um Logik in HTML-Templates zu implementieren und den Aufbau von Komponenten dynamisch zu gestalten.

Angular bietet sowohl vordefinierte Direktiven als auch die Möglichkeit, benutzerdefinierte Direktiven zu erstellen.

Arten von Angular-Direktiven¶¶

Angular-Direktiven lassen sich in drei Haupttypen unterteilen:

Strukturelle Direktiven: Verändern die Struktur des DOM (z. B. Hinzufügen oder Entfernen von Elementen).
Attribut-Direktiven: Ändern das Erscheinungsbild oder Verhalten eines DOM-Elements.
Komponenten-Direktiven: Erweiterte Direktiven, die mit einem eigenen Template ausgestattet sind.

Vordefinierte Data Directives¶¶

1. ngFor (Strukturelle Direktive)¶¶

Ermöglicht die Iteration über eine Liste und das dynamische Generieren von Elementen im DOM.

Beispiel:

<div *ngFor="let item of items">
  {{ item.name }}
</div>