Im Angular-Framework ist die Kommunikation zwischen nicht verwandten Komponenten ein häufiges Anliegen. Die korrekte Antwort auf dieses Problem bietet das Angular-Feature namens "Dienste und Abhängigkeitsinjektion".
Angular verwendet "Dienste" als Hauptmethode zur Trennung von Bedenken. Ein Dienst ist eine Klasse mit einem spezifischen Zweck. Er könnte beispielsweise Daten aus einer Datenbank abrufen oder Funktionen mit wiederkehrendem Code enthalten, die von mehreren Teilen Ihrer Anwendung benötigt werden.
Ein Dienst wird dann mit Hilfe der "Abhängigkeitsinjektion" (Dependancy Injection, DI) an die Komponenten weitergegeben, die ihn benötigen. Die Abhängigkeitsinjektion ist ein Designmuster, das das Erstellen von hart gekoppelten Abhängigkeiten zwischen Klassen verhindert. Stattdessen wird die benötigte Abhängigkeit, in diesem Fall der Dienst, zur Laufzeit bereitgestellt.
Betrachten Sie das folgende Praxisbeispiel:
import { Injectable } from '@angular/core';
@Injectable({
providedIn: 'root',
})
export class MessageService {
messages: string[] = [];
add(message: string) {
this.messages.push(message);
}
clear() {
this.messages = [];
}
}
In diesem Beispiel wird ein MessageService
erstellt, der Nachrichten in einer Anwendung verwalten kann. Das @Injectable()
-Dekorator markiert die Klasse als eine, die in andere Komponenten injiziert werden kann. Wenn nun eine Komponente diesen Service benötigt, kann sie ihn über den Konstruktor anfordern, wie im folgenden Code-Snippet gezeigt:
constructor(private messageService: MessageService) { }
In diesem Konstruktor wurde der MessageService
angefordert und kann nun in der Komponente verwendet werden. Das ist das Kernkonzept der Abhängigkeitsinjektion.
Die Verwendung von Diensten und Abhängigkeitsinjektion ermöglicht eine effiziente und gut strukturierte Kommunikation zwischen nicht verwandten Komponenten in Angular. Es unterstützt die Wiederverwendbarkeit, testet die Fähigkeit und die Wartbarkeit der Codestruktur.