AngularJS: ng-show for highest value of $index in ng-repeat

Question

I have a input form for email address and address.

User can add upto 3 emails and address-lines dynamically by clicking + sign on the right of the input field.

When I ng-repeat input field + is also repeated for every input field. How to show that + for only the last input field where the value of $index is maximum.

Answer 1

You can instead use $last special property of ng-repeat. It is a boolean value property set for the last item (item here means child scope created by ng-repeat and not the value of that particular iteration) in the ng-repeat. Something like:

  ... ng-show="$last"

or

 ... ng-if="$last"

See other special properties of ng-repeat

• $index - number iterator offset of the repeated element (0..length-1)
• $first - boolean true if the repeated element is first in the iterator.
• $middle - boolean true if the repeated element is between the first and last in the iterator.
• $last - boolean true if the repeated element is last in the iterator.
• $even - boolean true if the iterator position $index is even (otherwise false).
• $odd - boolean true if the iterator position $index is odd (otherwise false).

Also note that if you plan to use ng-show (not ng-if) you could as well achieve it using css selectors pseudo-class like :last-child , :last-of-type etc based on the context and DOM structure.