Ich versuche, eine Animation auf einigen Phrasen zu erstellen, die auf der Hauptseite der Website angezeigt werden, an einer zufälligen Position und mit Fade- und Translate-Effekten.
Ich würde dies erreichen, indem ich ng-style Attribut innerhalb eines ng-repeat -Attributs verwende und den ng-style-Wert durch Aufruf einer JavaScript-Funktion im HomeController festlege.
Mit dieser Annäherung Ursache Winkel werfen die Ausnahme: $ rootScope: infdig Fehler 10 $ Digest () Iterationen erreicht. Abbrechen! Beobachter haben in den letzten 5 Iterationen gefeuert
Ich habe so viel darüber gelesen, aber keine Lösung hat meinen Fall gelöst. Jeder könnte mir helfen?
Hier ist ein Teil von index.html:
%Vor%Hier ist die Controller-Funktion:
%Vor%}
Hier ist eine Demo: Ссылка
Hier ist eine Lösung, bei der ich Ihre Style-Generation in die Richtlinie verschoben habe. Die Position wird direkt vor dem Anzeigen des Elements festgelegt. Da dies eine CSS-Änderung ist, habe ich auch das Styling geändert, so dass die Position nicht übergeht.
Hier ist die Richtlinie. Der Code, den ich ausgeschlossen habe, wurde nicht geändert:
%Vor%CSS:
%Vor% Entfernen Sie in Ihrem HTML einfach ng-style
.
Plunker: Ссылка
@Hieu Le hat auf das Problem hingewiesen, aber Ihr Problem ist, dass, da Sie immer eine zufällige Position in Ihrer getTopLeftPosition
-Funktion zurückgeben, die angularjs-Digest-Schleife jedes Mal aufgerufen wird, um die Änderungen tatsächlich an die Beobachter weiterzuleiten. Dadurch lief es immer wieder rum.
Sie können Ihre zufälligen Positionen vorberechnen und diese dann in Ihrem HTML-Code verwenden.
In Ihrer Aktivierungsfunktion können Sie beispielsweise Folgendes tun:
%Vor%Und dann können Sie Ihren HTML-Code in etwa so ändern:
%Vor%Hier ist das Arbeiten mit meinen Änderungen: Ссылка
Ich denke, das Problem ist, dass Sie ng-Stil nicht so binden können. Es denkt, dass es getTopLeftPosition ständig aufrufen muss.
Ich habe es hier irgendwie zur Arbeit gebracht. Das Timing ist ein bisschen aus aber es gibt keine Fehler mehr. Hier habe ich $ interval verwendet, um Dinge zu wiederholen:
Bitte sehen Sie es hier an: Ссылка
%Vor%Dies könnte auch verwandt sein: angularjs infinite $ digle Schleife wenn kein Bereich ändert sich
Tags und Links javascript angularjs jquery angularjs-rootscope ng-style