I have an angular ng-repeat function. it repeats all the items in my list perfectly, but i need the items to only show one time.
HTML:
<div class="list">
<div class="item item-stable" ng-repeat="departure in flightSource" padding="false" ng-click="custom=!custom">
<div class="center">
Terminal {{departure.airportResources.departureTerminal}}
<div ng-hide="custom">hello</div>
</div>
</div>
</div>
JSON: As you can see I get two "TERMINAL 4" 's I only want one to show if it has been repeated already.
airportResources:
ObjectarrivalGate: "A9"
departureGate: "14"
departureTerminal: "1"
airportResources:
ObjectarrivalGate: "B1"
baggage: "5"
departureGate: "44B"
departureTerminal: "4"
airportResources:
ObjectdepartureGate: "44F"
departureTerminal: "4"
etc...
You can use a custom filter like such:
<div ng-repeat="d in Resources | unique: 'airportResources.departureTerminal'">
<div class="center">
Terminal {{d.airportResources.departureTerminal}}
</div>
</div>
And as an added bonus you don't have to write the custom filter yourself. It is part of a companion library called Angular-UI. I have implemented the solution for you at the following plunker: