Ich schreibe eine Angular-Komponente, die eine Eigenschaft hat Mode(): string
.
Ich möchte in der Lage sein, diese Eigenschaft programmgesteuert und nicht als Reaktion auf ein Ereignis festzulegen.
Das Problem ist, dass eine Vorlagenbindung ohne Browserereignis {{Mode}}
nicht aktualisiert wird.
Gibt es eine Möglichkeit, diese Änderungserkennung manuell auszulösen?
ChangeDetectorRef.detectChanges()
. Validatoren wurden ausgelöst, bevor meine Direktive den Wert einer Eingabe aktualisieren konnte.Ich habe eine akzeptierte Antwortreferenz verwendet und möchte ein Beispiel anführen, da die Angular 2-Dokumentation sehr schwer zu lesen ist. Ich hoffe, dass dies einfacher ist:
Import
NgZone
:Fügen Sie es Ihrem Klassenkonstruktor hinzu
Führen Sie den Code aus mit
zone.run
:quelle
zone.run
Code platzieren und was genau istdonations
?Ich konnte es mit markForCheck () aktualisieren
Importieren Sie ChangeDetectorRef
Injizieren und instanziieren
Zum Schluss soll die Änderungserkennung stattfinden
Hier ist ein Beispiel, in dem markForCheck () funktioniert und detectChanges () nicht.
https://plnkr.co/edit/RfJwHqEVJcMU9ku9XNE7?p=preview
(Drücken Sie STOP / RUN, um es erneut auszuführen.)
quelle
Probieren Sie in Angular 2+ den @ Input-Dekorator aus
Es ermöglicht eine nette Eigenschaftsbindung zwischen übergeordneten und untergeordneten Komponenten.
Erstellen Sie zunächst im übergeordneten Element eine globale Variable, die das Objekt / die Eigenschaft enthält, die an das untergeordnete Element übergeben werden.
Erstellen Sie als Nächstes eine globale Variable im untergeordneten Element, um das vom übergeordneten Objekt übergebene Objekt / die Eigenschaft zu speichern.
Fügen Sie dann im übergeordneten HTML-Code, in dem die untergeordnete Vorlage verwendet wird, eine eckige Klammer mit dem Namen der untergeordneten Variablen hinzu und setzen Sie sie gleich dem Namen der übergeordneten Variablen. Beispiel:
Fügen Sie schließlich, wo die untergeordnete Eigenschaft in der untergeordneten Komponente definiert ist, den Eingabe-Dekorator hinzu:
Wenn Ihre übergeordnete Variable aktualisiert wird, sollte sie die Aktualisierungen an die untergeordnete Komponente übergeben, die ihr HTML aktualisiert.
Um eine Funktion in der untergeordneten Komponente auszulösen, werfen Sie einen Blick auf ngOnChanges.
quelle
ChangeDetectorRef.detectChanges () - ähnlich wie $ scope. $ Digest () - dh nur diese Komponente und ihre untergeordneten Komponenten überprüfen
quelle