Directives that are aware of transcluded content (with ng-repeat)

253 views
Skip to first unread message

Chris Mueller

unread,
May 13, 2013, 10:48:55 PM5/13/13
to ang...@googlegroups.com
This is my first time posting on this list, so please go easy on me. :-)

I've been loving Angular. I've used it for a few small projects and was impressed enough to start using it in a large-scale project that I'm porting from Backbone.

I'm trying to understand the order of compilation, pre-linking, and post-linking in directives. Specifically, the expected order of operations seems to break down when using an ng-repeat inside of another directive.

I used this Plunker as a reference to understand when the compilation/linking phases happen relative to one another:

That I was able to essentially replicate in JSFiddle:

But when I modified that JSFiddle to include an ng-repeat, the order changes so that the parent's post-link happens *before* the children's linking functions.

So my question is: Is there a consistently good way to understand when the linking functions for nested directives have completed? 

(My use case involves building a directive that is aware of its child elements, which may be dynamically changing. So far the only way I can make it work is to use a $timeout that occasionally looks at the DOM beneath the parent directive's element to see if it's consistent or not with some aspect of scope. If the DOM and scope aren't in alignment then the parent directive updates itself. This unfortunately requires a very custom solution in each case and is results in brittle code. Maybe there's a better way to do this?)

Thanks!
Chris

Sander Elias

unread,
May 14, 2013, 11:09:07 AM5/14/13
to ang...@googlegroups.com
Hi Chris,

yes, you can set priority on your directives. This is documented, however, you need to play around with it to really get the inner workings off it. The thing you are hitting is the "The order of directives within the same priority is undefined"!

Regards
Sander Elias

Chris Mueller

unread,
May 14, 2013, 3:09:06 PM5/14/13
to ang...@googlegroups.com
Hi Sander,

Thanks for the reply. I played around with priority settings on some directives and have a much better understanding of that concept.

(Fiddle with some experiments related to ng-repeat here if anyone is interested: http://jsfiddle.net/martian/SH8aB/2/)

The aspect that confused me originally is that ng-repeat sets up watchers on its data, and then doesn't process directives in the normal chain. In other words: the post-link phase of parent directives fire before the pre-link functions of directives within the ng-repeat. In hindsight, this makes perfect sense.

Chris


--
You received this message because you are subscribed to a topic in the Google Groups "AngularJS" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/Q6nlin_p1cM/unsubscribe?hl=en-US.
To unsubscribe from this group and all its topics, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular?hl=en-US.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

Sander Elias

unread,
May 15, 2013, 6:58:05 AM5/15/13
to ang...@googlegroups.com
Hi Chris,

Your welcome, this is indeed one of the area's where you need to fiddle around to get what's going on!

Regards
Sander
Reply all
Reply to author
Forward
0 new messages