CODEWITHSUNDEEP
javascriptangularjs
infinity
infinity

Reputation: 719

Only show first element of ng-repeat

How do I show only the first element in angular?

I'm using ng-repeat like this:

<div ng-repeat="product in products" ng-show="$first">
    <div>{{ product.price }}</div>
</div>

But since I'm not repeating, then I shouldn't have to use ng-repeat? How can I get this to display just the first, without having to go in a ng-repeat?

Upvotes: 12

Views: 32507

Answers (4)

nderoche
nderoche

Reputation: 1816

You might also want to use

<div ng-repeat="product in products|limitTo:1">
   <div>{{ product.price }}</div>
</div>

but yes the code below is better

<div>{{products[0].price}}</div

Upvotes: 58

jfountain
jfountain

Reputation: 3815

Alternately you can show the last in an array by doing this:

<div>{{ products[products.length-1].price }}</div>

Upvotes: 1

Ufuk Hacıoğulları
Ufuk Hacıoğulları

Reputation: 38468

Don't use ng-repeat directive, this should work:

<div>{{ products[0].price }}</div>

Upvotes: 25

user2445124
user2445124

Reputation:

You can use this:

<div ng-bind="products[0].price"></div>

It will use the first element of the array.

Upvotes: 5

Related Questions