Ich habe ein div-Element mit der ng-bind-Direktive:
%Vor%Ich habe eine Anweisung, die ein Element erhält, seinen Wert / Text überprüft und dem Element eine Farbe entsprechend dem Inhalt hinzufügt. Ich verwende diese Richtlinie so:
%Vor% Das Problem ist, dass zu der Zeit, zu der die Anweisung ausgeführt wird, kein Wert oder Text auf dem Div vorhanden ist, weil ng-bind noch nicht geschehen ist.
Ich erhalte den Text mit element.text ().
Irgendeine Idee, wie man den Text innerhalb meiner Direktive verfügbar macht?
Bearbeiten 2
Die andere Möglichkeit besteht darin, ng-class oder ng-style zu verwenden, um die Farbe des Textes zu ändern. Dann müssen Sie keine neue Direktive erstellen.
Ursprüngliche Antwort
Ich würde überhaupt nicht von der ng-bind -Richtlinie abhängen ... Das scheint meiner Meinung nach viel sauberer zu sein.
Und dann definiere deine Direktive als ...
%Vor% Auf diese Weise können Sie Ihre Anweisung verwenden, auch wenn Sie kein ng-bind für das Element haben (zum Beispiel, wenn Sie stattdessen geschweifte Klammern verwenden).
Alternativ können Sie auch attrs.$observe(...) ( Dokumentation ) verwenden scope.$watch(...) .
und
%Vor% Weitere Informationen zu den Unterschieden zwischen scope.$watch(...) und attrs.$observe() hier .
Bearbeiten
Wenn Ihre Anweisung im Grunde das DOM nach der ng-bind -Direktive mutiert, warum überspringen Sie nicht die ng-bind alle zusammen?
und
%Vor% Ihre Direktive wird möglicherweise ausgeführt, bevor ngBind ihren Wert gebunden hat - sowohl Ihre Direktive als auch ngBind haben die Priorität 0, also könnten beide zuerst ausgeführt werden, dazu gleich mehr - aber schauen wir uns die ngBind Quellcode , um die Wurzel des Problems zu sehen:
Wir sehen, dass ngBind das DOM nicht sofort aktualisiert, sondern stattdessen das Attribut ngBind überwacht. Daher wird das Element erst aktualisiert, wenn diese Überwachung im nächsten $digest -Zyklus ausgeführt wird (daher funktioniert $timeout ).
Eine Option besteht also darin, ngBind nachzuahmen und eine eigene Überwachung auf ihr Attribut zu setzen - dann werden Sie jedes Mal aktualisiert, wenn sich das ngBind -Ergebnis ändert:
Sie werden bemerken, dass ich die Priorität auf 1 gesetzt habe. Sie müssen sicherstellen, dass die Uhr dieser Direktive hinter der Uhr ngBind in der Überwachungswarteschlange steht. Dadurch wird sichergestellt, dass das Element von ngBind zuerst aktualisiert wurde.
Standardmäßig wird die Link-Funktion einer Anweisung nach dem Link ausgeführt, so dass die $compile docs -Note folgendermaßen aussieht:
Richtlinien mit höherer numerischer Priorität werden zuerst kompiliert. Pre-Link-Funktionen werden auch in der Reihenfolge der Priorität ausgeführt, aber nach dem Link Funktionen werden in umgekehrter Reihenfolge ausgeführt.
Daher, da ngBind die Priorität 0 hat, wird alles über 0 sicherstellen, dass die Uhr Ihrer Anweisung nach dem ngBind watch ..
Sie könnten einen Bereich verwenden. $ wachen Sie in Ihrer Link-Funktion auf und achten Sie auf Modelländerungen. Jedes Mal, wenn sich der Wert ändert, wird ng-bind ausgelöst und Ihre Anweisung wird ausgelöst, unabhängig von der bg-bind-Direktive und nur abhängig vom Modul selbst.
Leider kann ich Sie nicht mit Beispielcode als im auf einem Tablet während der Beantwortung Ihrer Frage presnt.
Tags und Links javascript angularjs angularjs-directive