Sha
Sha

Reputation: 1974

Get the length of items in ng-repeat outside the loop in Angular JS

I have the following HTML where i am listing few items with Angular JS ng-repeat

<div class="header-container">
    <div class="header-list" data-ng-repeat="details in response.data" data-ng-show='$index<3'>{{ details.name }}</div>
    <div class="show-more" data-ng-if="details.length > 3"></div>
</div>

enter image description here

header-list and show-more are sibling divs and i have ng-repeat on header-list. i only want to show the div show-more if the number of items in header-list is more than 3. since the scope of the ng-repeat is not in show-more i cannot do this. is there a way to do this without changing the DOM structure? Thanks in advance

Upvotes: 0

Views: 68

Answers (1)

mindthefrequency
mindthefrequency

Reputation: 546

simple:

<div class="header-list" data-ng-repeat="details in response.data | limitTo: 3">{{ details.name }}</div> 
<div class="show-more" data-ng-if="response.data.length > 3">View All</div>

Upvotes: 1

Related Questions