Do not repeat item in ng-repeat area

Question

Is it possible to somehow define in angular that I do not want to repeat some html tags inside the ng-repeat scope. E.g. I want to create a tab filter like this:

  <div class="searchandfilter" ng-app="phonecatApp"> <span ng-controller="PhoneListCtrl"> <span ng-repeat="phone in phones" class="tab-controller"> <ul> <li class="tab" >{{phone.name}}</li> </ul> <span class="tab-content dont-repeat"> <span> <input type="checkbox">{{phone.brand}}</input> </span> </span> </span> </span> </div> 

I do not want to repeat the span with the dont-repeat class, but the span with input inside I need to repeat.

Jsfiddle

Answer 1

This can be done simply by using $first in ng-if , for example ng-if="$first"

Markup

 <span ng-if="$first" class="tab-content dont-repeat"> <span> <input type="checkbox">{{phone.brand}}</input> </span> </span> 

Jsfiddle