I'm fairly new to Javascript programming and I have only touched upon AngularJS. In order to evaluate it I decided to write a simple note application. The model is really simple, a list of notes where each note has a label, a text and a list of tags. However I ran into problem passing data between isolated scopes of nested directives.
I have three directives, notes, note and tagger (defining new elements with the same names). Each of them using an isolated scope.
The notes directive uses ng-repeat to "render" each one of its notes with the note element.
The note directive uses the tagger element to "render" the list of tags.
The note directive defines scope: { getNote: "&", ... } in order to pass a note instance from the list of notes to the note controller/directive. The getNote(index) function is called in the link function of the note directive. This works fine!
The tagger directive defines scope: { getTags: "&", ... } in order to pass a list of tags for a given note to the tagger controller/directive. The getTags function is called in the link function of the tagger directive. This does not work!
As I understand it, the problem is that the link functions of the directives are called in an inconsistent order. Debugging the application shows that the link functions are called in the following order:
link function in the notes directive (adding the getNote function to the notes scope)
link function in the tagger directive of the first note (calling getTags in the parent note scope) function
link function in the first note directive (adding the getTags to the scope) (calling getNote in the parent notes scope)
link function in the tagger directive of the second note (calling getTags in the parent note scope) function
link function in the second note directive (adding the getTags to the scope) (calling getNote in the parent notes scope)
This will not work since in #2 the scope of the first note has not yet an getTags function.
A simplistic example can be found in Plunker.
Hence, my question boils down to: What determines the order in which link functions are called in nested directives.
(I solved to the problem using $watch on getTags in the tagger directive...)
regards
