Access Sibling elements in Angularjs directive -

i want show 'hr' divider when has previous , next siblings in below html content:

<ul>     <li ng-if="condition1">one</li>     <li ng-if="condition2">two</li>     <divider>     <li ng-if="condition3">three</li>     <li ng-if="condition4">four</li> </ul> 

the divider directive definition below:

restrict: 'ea' transclude: true priority: -1 scope: {} template: '<hr ng-if="show">' link:     post:(scope, element, attrs) ->       // check if divider element has previous , next siblings here; how it??       scope.show = true 

i not sure how access sibling elements. tried element.sibling(), element.next().

when used element.parent().html() in console, shows:

<!-- ngif: condition1 --> <!-- ngif: condition2 --> <divider><hr ng-if="show"></divider> <!-- ngif: condition3 --> <!-- ngif: condition4 --> 

the ng-if conditions above not evaluated before though priority has been set '-1'.

can please help.

i think should consider using css instead, it's simpler.

you can hide divider that:

1. is @ beginning of list
2. is @ end of list
3. is after divider (prevents duplicate dividers)

example:

.divider:first-child,  .divider:last-child,  .divider + .divider { display: none; }

<ul>    <li class="divider">-----</li>    <li>one</li>    <li class="divider">-----</li>    <li>two</li>    <li>three</li>    <li>four</li>    <li class="divider">-----</li>    <li class="divider">-----</li>    <li class="divider">-----</li>    <li>five</li>    <li class="divider">-----</li>  </ul>

this render expected