Ich verwende Angular 2 (TypeScript)
Ich habe zwei Komponenten (eigentlich sind es auch zwei Seiten). Sie sind nicht Eltern-Kind-Beziehung.
Ich möchte einen Wert an die zweite Komponente (Seite) übergeben, wenn ich auf den Link in der ersten Komponente (Seite) klicke.
Ich kenne "URL-Parameter" Weg durch Router. Aber ich möchte diesen Parameter nicht im Link anzeigen. Gibt es einen anderen Weg?
Danke!
Der kanonische Weg besteht darin, einen injectable -Dienst einzurichten und den Dienst in alle Komponenten einzufügen, die die Daten benötigen. Da der Dienst ein Singleton ist, greifen die Komponenten auf die gleichen Daten zu. Es sollte nicht wichtig sein, dass sie sich auf verschiedenen Seiten befinden. Plunker hier .
%Vor%Bearbeiten: Hier ist ein komplizierteres Beispiel, das die wechselseitige Kommunikation zwischen Komponenten durch Abonnieren eines eventEmitter für einen Dienst veranschaulicht: Plunker
Danke MarkM! Es funktioniert, aber es war schwierig für mich, weil ich es alles in verschiedenen Dateien und über letzten eckigen2 mit eckigen kli ... So erkläre ich es hier:
Zunächst einmal: Sie müssen eine Datei mit der Klasse erstellen, die Sie für andere Komponenten freigeben möchten: data.service.ts und sie zu "@Injectable" machen:
%Vor%Stellen Sie sicher, dass Sie die erstellte Klasse (myService) für "providers" nur einmal in der Datei app.module.ts festlegen und die injizierbare Datei importieren: data.service.ts :
%Vor%Wo immer Sie Ihre Shared-Klasse verwenden möchten, verwenden Sie den Konstruktor, um ein Objekt aus der Klasse zu erstellen (dieses Objekt wird dank des @ Injectable Decorators für Ihre Komponenten eindeutig sein). Denken Sie daran, es in jede Datei zu importieren, die Sie verwenden! ...
In meinem Fall setzt diese Ansicht die Daten des Objekts mit einer Texteingabe: input.component.ts
%Vor%Und in dieser Ansicht sehe ich nur die Daten, die für das Objekt festgelegt wurden: content.component.ts
%Vor%Ich hoffe diese Info ist nützlich!
Tags und Links angular typescript angular2-routing