CODEWITHSUNDEEP
angularjs
Valter Júnior
Valter Júnior

Reputation: 948

AngularJS two directives do same thing(change color), which one changes color?

I saw this question in a hiring interview and I don't know the answer. Can anybody help?

Question:

Assuming AngularJS, with simple directives that set the text colour

<div blue-if="true" orange-if="true">
Color
</div>

What color is applied? And why? And whats a better way to do this?

Upvotes: 0

Views: 44

Answers (1)

Justin
Justin

Reputation: 2970

There is an option for directives priority that determines the order in which a directive is applied relative to other directives on the same element or when nested. The option is numerical and defaults to 0 if not specified, with higher numbers given higher priority.

Check priority under $compile in the Angular docs. Also a good blog post here that goes into more detail.

If none of the directives in question have priority specified they are applied in alphabetical order. So in this case blue then orange would be applied, leaving the text orange.

Note that the Angular docs (under that $compile section above) state that the order of directives with undefined priority isn't actually set, I've just noticed in practice - as have others - that it appears to be alphabetical.

Upvotes: 3

Related Questions