I have an array of famous `places`, each place contains a `tour` array with 20 elements 20 is the number of tours under each famous places. e.g. 'Egypt' contains 20 tours in its attractive locations. But problem is some tours do not contain any hotels, but some tours have hotels. Here is my code.

```
<div ng-repeat="tour in place.tours | limitTo:3" ng-show="tour.hotels.length != 0">
  <li>
    <a ng-repeat="hName in tour.hotels"> {{hName.name}}
    </a>
  </li>
 </div>

```

in 1st `ng-repeat` i have shown only the **tour** containing hotel(number of hotel is 1) using `ng-show` . in the 2nd `ng-repeat` i have displayed hotel names from the `hotels` array.

*Ultimately, i have extracted all hotel names from the tours that contain hotel using two* `ng-repeat`.

Everything is working fine, but now i want to show only first 3 hotel names from the hotel-list which i got from 2nd `ng-repeat`. But adding `limitTo:3` in the 1st `ng-repeat` is not showing 1st 3 hotel name, because 1st 3 elements are already hidden as there are no hotel, but there **indexes** remains ! .

i found this similar topic ,but it was unable to help [Using ng-repeat and limitTo to limit the number of visible items displayed](https://stackoverflow.com/questions/19601028/using-ng-repeat-and-limitto-to-limit-the-number-of-visible-items-displayed)

How can I show only 1st 3 hotel name from the filtered hotel list? or What i am doing wrong?