Ich bin ziemlich neu in der Javascript-Programmierung und habe AngularJS nur gestreift. Um es auszuwerten, entschied ich mich, eine einfache Notizanwendung zu schreiben. Das Modell ist wirklich einfach, eine Liste von Notizen, in denen jede Notiz ein Label, einen Text und eine Liste von Tags hat. Allerdings habe ich Probleme beim Übertragen von Daten zwischen isolierten Bereichen verschachtelter Direktiven.
Ich habe drei Direktiven, Notizen, Notizen und Tagger (Definition neuer Elemente mit den gleichen Namen). Jeder von ihnen verwendet einen isolierten Bereich.
Die Noten-Anweisung verwendet ng-repeat, um jede Note mit dem Notenelement zu "rendern".
Die Notiz Direktive verwendet das Tagger-Element, um die Liste der Tags zu "rendern".
Die Notenanweisung definiert den Geltungsbereich: {getNote: "& amp;", ...}, um eine Noteninstanz aus der Liste der Noten an den Notencontroller / die Direktive zu übergeben. Die Funktion getNote (index) wird in der Verknüpfungsfunktion der notedirektive aufgerufen. Das funktioniert gut!
Die Tagger-Direktive definiert den Geltungsbereich: {getTags: "& amp;", ...}, um eine Liste von Tags für eine bestimmte Notiz an den Tagger-Controller / die Direktive zu übergeben. Die getTags-Funktion wird in der Link-Funktion der Tagger-Direktive aufgerufen. Das funktioniert nicht!
Nach meinem Verständnis besteht das Problem darin, dass die Verknüpfungsfunktionen der Direktiven in einer inkonsistenten Reihenfolge aufgerufen werden. Das Debuggen der Anwendung zeigt, dass die Verknüpfungsfunktionen in der folgenden Reihenfolge aufgerufen werden:
Link-Funktion in der Notes-Direktive (Hinzufügen der getNote-Funktion zum Notizenbereich)
Link-Funktion in der Tagger-Direktive der ersten Note (Aufruf von getTags in der übergeordneten Notiz) Funktion
Link-Funktion in der ersten Hinweis-Anweisung (Hinzufügen der getTags zum Umfang) (ruft getNote im Bereich der Elternanmerkungen auf)
Link-Funktion in der Tagger-Direktive der zweiten Note (Aufruf von getTags in der übergeordneten Notiz) Funktion
Link-Funktion in der zweiten Hinweis-Anweisung (Hinzufügen der getTags zum Umfang) (ruft getNote im Bereich der Elternanmerkungen auf)
Das wird nicht funktionieren, da in # 2 der Umfang der ersten Note noch keine getTags-Funktion hat.
Ein einfaches Beispiel finden Sie in Plunker .
Daher lautet meine Frage: Was bestimmt die Reihenfolge, in der Link-Funktionen in verschachtelten Direktiven aufgerufen werden.
(Ich habe das Problem mit $ watch auf getTags in der Tagger-Direktive gelöst ...)
Grüße
Zitat von Josh D. Miller, der freundlicherweise auf eine ähnliche Frage geantwortet hatte:
"Nur ein paar technische Notizen. Angenommen, Sie haben dieses Markup:
%Vor%Nun wird AngularJS die Direktiven erstellen, indem er direktive Funktionen in einer bestimmten Reihenfolge ausführt:
directive1: kompilieren
directive2: kompilieren
directive1: Controller
directive1: pre-link
directive2: Controller
directive2: pre-link
directive2: post-link
directive1: post-link
Standardmäßig ist eine direkte "Link" -Funktion ein Post-Link, so dass die Link-Funktion Ihrer äußeren directive1 erst ausgeführt wird, nachdem die Link-Funktion der inneren directive2 gelaufen ist. Deshalb sagen wir, dass es nur sicher ist, DOM-Manipulation in der Post-Link zu machen. "
Bei einem einzelnen Element wird die Reihenfolge der Verknüpfungsfunktionen durch die Reihenfolge der Kompilierfunktionen bestimmt, die ihrerseits nach der priority -Eigenschaft des Objekts mit der Anweisungsdefinition geordnet sind.
Quelle: Ссылка
Bei mehreren Elementen mit Transclusion: Die inneren Direktiven werden vor den äußeren Direktiven ausgewertet. Grund: Art der Transkription.
Bei mehreren Elementen mit Geschwistern: Wird von oben nach unten ausgeführt. Grund: Parsing-Logik von $ compile.
Tags und Links angularjs angularjs-directive angularjs-scope angularjs-ng-repeat