Kolejność wywoływania funkcji łącza w zagnieżdżonych i powtarzanych dyrektywach angularjs

Question

Jestem dość nowa w programowaniu JavaScript i tylko dotknąłem AngularJS. W celu jej oceny postanowiłem napisać prostą aplikację nutową. Model jest naprawdę prosty, lista notatek, gdzie każda notatka ma etykietę, tekst i listę znaczników. Wystąpił jednak problem polegający na przekazywaniu danych między odizolowanymi zakresami zagnieżdżonych dyrektyw.

Mam trzy dyrektywy, notatki, notatkę i tagger (definiowanie nowych elementów o tych samych nazwach). Każdy z nich używa izolowanego zakresu.

Dyrektywa zauważa, że ​​ng-repeat służy do "renderowania" każdej z notatek za pomocą elementu nutowego.

Dyrektywa note używa elementu tagger do "renderowania" listy znaczników.

Dyrektywa nutowa określa zakres: {getNote: "&", ...} w celu przekazania instancji notatki z listy uwag do kontrolera/dyrektywy. Funkcja getNote (index) wywoływana jest w funkcji łącza dyrektywy note. To działa dobrze!

Dyrektywa taggera określa zakres: {getTags: "&", ...} w celu przekazania listy znaczników dla danej nuty do kontrolera/dyrektywy znacznika. Funkcja getTags jest wywoływana w funkcji linkowania dyrektywy tagger. To nie działa!

Jak rozumiem, problemem jest to, że funkcje linkowe dyrektyw są wywoływane w niespójnej kolejności. Debugowania aplikacji pokazuje, że funkcje łącza nazywane są w następującej kolejności:

1. Link funkcja w notach dyrektywy (dodawanie funkcji getNote zakresu Notes)

2. funkcji ogniwem w dyrektywie Taggera od pierwszej nuty (wywołanie getTags w zakresie rodzic uwaga) funkcja

3. funkcję łącza w pierwszej dyrektywy uwaga (dodanie getTags do zakresu) (wywołanie getNote w zakresie noty dominująca)

4. funkcji ogniwem w dyrektywie Taggera drugiej nocie (wywołanie getTags w zakresie rodzic uwaga funkcja)

5. łącza funkcję w drugiej dyrektywy uwaga (dodając do getTags do zakres) (wywołanie getNote w dominującej zauważa zakres)

To nie zadziała, ponieważ w # 2 zakres od pierwszej nuty jeszcze nie funkcję getTags.

Uproszczony przykład można znaleźć w Plunker.

W związku z tym moje pytanie sprowadza się do: Co decyduje o kolejności wywoływania funkcji łącza w dyrektywach zagnieżdżonych.

(Rozwiązałem problem za pomocą funkcji $ watch na getTags w dyrektywie tagger ...)

pozdrowienia

Answer 1

Cytowanie Josh D. Miller, którzy uprzejmie odpowiedział na podobne pytanie miałem:

"Zaledwie kilka notatek technicznych Załóżmy, że masz ten znaczników.

<div directive1> 
    <div directive2> 
    <!-- ... --> 
    </div> 
</div> 

Teraz angularjs stworzy dyrektyw, uruchamiając funkcję dyrektywy w określonej kolejności:

dyrektywy1: skompilować

dyrektywy2: skompilować

dyrektywy1: kontroler

dyrektywy1: pre-link

dyrektywy2: kontroler

dyrektywy2: pre-link

dyrektywy2: post-link

dyrektywy1: post-link

Domyślnie prosta funkcja "Link" jest post-link, więc funkcja Połącz swoje Outer dyrektywy1 nie będzie uruchamiane do momentu uruchomienia funkcji linku wewnętrznego dyrektywy2. Dlatego mówimy, że manipulowanie DOMem jest bezpieczne tylko w post-link. "

Answer 2

na pojedynczym elemencie kolejność funkcji łączących jest określona przez kolejność funkcji skompilować który z kolei jest uporządkowanych według właściwości obiektu definicji dyrektywa priority.

Źródło: http://docs.angularjs.org/guide/directive

Na wielu elementów z transkluzji: dyrektyw wewnętrzne są oceniane przed dyrektyw zewnętrznych. Powód: Natura transclusion.

Na wiele elementów z rodzeństwem: Wykonane w kolejności od góry do dołu. Powód: Analiza składniowa kompilacji $.