Der eckige Code , der auf jsfiddle platziert wurde, bezieht sich auf eine benutzerdefinierte Anweisung, die $compile($element)($scope) verwendet und die ng-click-Aktion auslöst zweimal passieren:
Meine Fragen sind:
$compile($element)($scope) aufzurufen? Hier sind die Details und was ich bisher gesammelt habe:
Ich würde gerne verstehen, warum die ng-click Aktion zweimal passiert? Die folgende Zeile zeigt die benutzerdefinierte Anweisung "Hallo" und ng-Klick auf eine Schaltfläche. Die benutzerdefinierte Anweisung ruft $compile($element)($scope) auf, und das ist die Zeile, die bewirkt, dass die Aktion zweimal ausgelöst wird, aber ich verstehe nicht wie?
Test KLICKEN!
Hier ist der Code - Ссылка
%Vor% Was ist der Zweck des Aufrufs von $compile($element)($scope) , was passiert, wenn es nicht aufgerufen wird und unter welchen Umständen sollte es aufgerufen werden?
(Klicken Sie auf den Knopf und Sie werden feststellen, dass die Aktion zweimal passiert)
Die Absicht der Direktive ist es, basierend auf einer Logik zu verstecken / zu deaktivieren.
Also sehe ich in dieser Direktive $element.removeAttr("ng-hide") , etc, und jedes Mal, wenn $element.removeAttr aufgerufen wird, folgt ein $compile($element)($scope) , ist der Zweck, das DOM neu zu schreiben?
Ich habe das DOM untersucht und sehe ng-click nicht mehrfach definiert. Als ich das DOM (firebug) untersuchte, betrachtete ich $ element- & gt; 0- & gt; -Attribute- & gt; ng-click (neben anderen Elementen).
Wenn ich ng-click mit $element.removeAttr("ng-click") entferne, passiert die Aktion nur einmal.
Oder wenn ich die $compile($element)($scope) entferne, passiert die Aktion nur einmal.
Ich denke, der Hauptgrund dafür ist, dass Sie ein click -Ereignis in dem Element verwenden, in dem Sie die Anweisung anwenden, anstatt dieses Ereignis direkt in der Direktive zu definieren. Daher erhalten Sie den Klick vom Button-Element, aber auch den Klick vom Direktiven-Controller.
Was $ compiles macht, wenn es einmal gegen Markup aufgerufen wird, erzeugt eine Funktion, die Sie verwenden können, um das Markup an einen bestimmten Bereich zu binden (was Angular eine Verknüpfungsfunktion aufruft), deshalb Rodion schlug vor, einen Link zu verwenden, denke ich. In diesem speziellen Fall bedeutet das, dass Sie ein Ereignis direkt in der Elementschaltfläche verwenden, dieses dann aber mithilfe von $ compile erneut mit dem Bereich in Ihrer Anweisung verknüpfen. Ich denke, deshalb bekommst du die Nachricht zweimal.
Da ich nicht weiß, ob das klar ist, habe ich die Informationen von diesem Link erhalten Ссылка wo es viel besser erklärt ist.
Hier auch ein JSFiddle, wo Sie sehen können, wie es funktioniert (Auszug aus dem obigen Artikel).
%Vor%kompilieren - $ compileProvider - Service in Modul ng Kompiliert eine HTML-Zeichenfolge oder ein DOM in einer Vorlage und erstellt eine Vorlagenfunktion, die dann zum Verknüpfen von Bereich und Vorlage verwendet werden kann.
Bei der Kompilierung werden der DOM-Baum und die DOM-Elemente mit Direktiven verglichen.
Tags und Links javascript angularjs dom