Wie injiziere ich Dienste außerhalb von Komponenten in Angular 2?

Abhängigkeitsinjektion in Angular 2: Injizieren von Diensten außerhalb von Komponenten

In Angular 2 ist das Injizieren von Diensten in Komponenten mithilfe des @Component-Dekorators unkompliziert . Es gibt jedoch Szenarien, in denen Sie möglicherweise Dienste außerhalb von Komponenten einfügen müssen. In diesem Artikel wird erläutert, wie dies mithilfe der Abhängigkeitsinjektion (DI) erreicht werden kann.

Injizierbare Dienste

Um DI für einen Dienst zu aktivieren, muss dieser mit dem @Injectable-Dekorator dekoriert werden . Dieser Dekorator markiert die Klasse als injizierbar, sodass ihre Parameter injiziert werden können. Beachten Sie, dass der Name „Injizierbar“ etwas irreführend ist, da er die Klasse nicht injizierbar macht, sondern vielmehr in dem Sinne, dass ihre Parameter injizierbar sind.

Abhängigkeitsinjektionsmechanismus

Angular 2 verwendet ein hierarchisches System von Injektoren, wobei jede Ebene einer bestimmten Komponente oder einem bestimmten Komponentensatz entspricht. Wenn das DI-System auf eine Abhängigkeit stößt, sucht es zunächst im aktuellen Injektor. Wenn die Abhängigkeit nicht gefunden wird, bewegt sie sich in der Injektorhierarchie nach oben, bis sie einen Anbieter für die Abhängigkeit findet.

Dienste über mehrere Injektoren hinweg injizieren

Um einen Dienst in einen anderen einzufügen Für den Dienst definieren Sie einfach die Abhängigkeit im Konstruktor des abhängigen Dienstes und fügen den @Injectable-Dekorator zum abhängigen Dienst hinzu.

Für Beispiel:

@Injectable()
export class MyFirstSvc {
  // ...
}

@Injectable()
export class MySecondSvc {
  constructor(private myFirstSvc: MyFirstSvc) {
    // ...
  }
}

In diesem Beispiel hängt MySecondSvc von MyFirstSvc ab und kann in jeden Injektor injiziert werden, in dem MyFirstSvc verfügbar ist.

Anbieter definieren

Um den Anbieter für einen Dienst anzugeben, verwenden Sie das Provider-Array im @Component- oder NgModule-Dekorator. Wenn Sie beispielsweise MyFirstSvc als Anbieter im Anwendungsinjektor definieren möchten, können Sie dies wie folgt tun:

@Component({
  // ...
  providers: [MyFirstSvc]
})
export class AppComponent {
  // ...
}

Fazit

Durch Verständnis der Hierarchie Dank der Art der Injektoren und des @Injectable-Dekorators können Sie Dienste außerhalb von Komponenten in Angular 2 effektiv injizieren. Dadurch können Sie modulare und wiederverwendbare Dienste erstellen, die einfach injiziert und gemeinsam genutzt werden können in Ihrer gesamten Anwendung.

Das obige ist der detaillierte Inhalt vonWie injiziere ich Dienste außerhalb von Komponenten in Angular 2?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!