Ich kann den Wert der Variablen einer Komponente aus einer anderen Komponente ändern, wie in diesem Beispiel console.log()
angezeigt wird.
Mein Problem ist, dass die Ansicht der zweiten Komponente trotz der Variablenänderung nicht aktualisiert wird.
Beispiel:
first.component.ts
%Vor%zweite.component.ts
%Vor%Beide Komponenten sind vollständig nicht verwandt aus verschiedenen Zweigen der DOM-Struktur.
Ich habe auch versucht, dass die erste Komponente ein Ereignis ausstrahlt und die zweite Komponente dasselbe mit dem gleichen Ergebnis abonniert. Die Variable ändert sich aber die Ansicht wird nicht aktualisiert.
Nach Günters Vorschlag (danke) habe ich mit der nächsten Lösung erfolglos versucht. Selbst das console.log
funktioniert nicht.
first.component.ts
%Vor%update.service.ts
%Vor%zweite.component.ts
%Vor% Schließlich funktionierte die von Günter vorgeschlagene Lösung nach dem Hinzufügen von UpdateService
als provider
in @NgModule
von app.module.ts
update
Ich bin mir ziemlich sicher, dass die Ursache Ihres Problems darin besteht, dass Sie
erwarten %Vor%etwas tun, was es überhaupt nicht tut.
Mit diesem Konstruktor erhalten Sie eine SecondComponent
Instanz, die nicht mit der auf Ihrer Seite gezeigten Komponente verknüpft ist. Aus diesem Grund wird Ihre Ansicht nicht aktualisiert. Sie haben die sichtbare Komponente nicht aktualisiert, sondern eine völlig unabhängige Klasse.
Sie müssen eine andere Strategie verwenden, um eine Referenz auf die andere Komponente zu erhalten.
Der beste Weg ist, nicht einen Verweis auf die Komponente überhaupt zu erhalten, sondern stattdessen einen gemeinsamen Dienst für beide bereitzustellen und mit Observablen zu kommunizieren.
Weitere Einzelheiten finden Sie unter dieses offizielle eckige 2 Kochbuch
Original
Wenn beide Komponenten "völlig unabhängig" sind, nehme ich an, dass sie aus einzelnen Bootstrapping-Modulen stammen und sich daher in verschiedenen Angular2-Anwendungen auf derselben Seite befinden.
In diesem Fall werden diese Komponenten in verschiedenen Zonen ausgeführt, und das Ereignis click
bewirkt nur eine Änderungserkennung in der aufrufenden Komponente, jedoch nicht in der aufgerufenen Komponente.
Sie müssen die Änderungserkennung im aufgerufenen Objekt explizit aufrufen, um die Ansicht zu aktualisieren. Zum Beispiel wie
%Vor%oder
%Vor%Tags und Links angular components