Runtime Terror
Runtime Terror

Reputation: 6752

Don't repeat element in ng-repeat scope

Is it possible to somehow define in angular, that I don't want to repeat some html tags inside ng-repeat scope. For 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 don't want to repeat span with class dont-repeat, but span with input inside I need to repeat.

JSFiddle

Upvotes: 4

Views: 1809

Answers (1)

Pankaj Parkar
Pankaj Parkar

Reputation: 136184

It could be doable by just using $first in ng-if like ng-if="$first"

Markup

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

JSFiddle

Upvotes: 5

Related Questions