Angularjs: ng-repeat, put a ´divider´ in ng-repeat to separate data that was recently loaded

Question

When the page is loaded the user is presented with a set of products, then if he/she clicks a button more products are fetched and appended to the list. I am trying to find an Angular way to put a row to separate the products that were already loaded from the recently appended. I don't want to manipulate the DOM directly and I can't push an empty row to the array of products because the length of the array is used somewhere else.

How could I do this?

Here is a basic Bin

Answer 1

If you don't want a divider after the last item, just use:

<... ng-repeat="...">
   <hr ng-show="!$last" />
   ...
</...>

$last is true if the repeated element is last in the iterator.