title: Get next item in array on ngClick
body: <p>I'm really new to AngularJS.
  I'm trying to create a simple web app that is nothing more than a page that displays a product. When the user clicks next they are taken to the next product in the array.</p>
  
  <p>At the moment I'm able to use the ngRepeat directive to show all items in the array:</p>
  
  <pre><code>&lt;body class="container" ng-controller="StoreController as store"&gt;
  &lt;center&gt;&lt;div ng-repeat="product in store.products"&gt;
      &lt;img width="200" ng-src="{{product.images}}"/&gt;
      &lt;h4&gt;{{product.item}}&lt;/h4&gt;
  
      &lt;h4&gt;Amount: {{product.number}} count: {{count}}&lt;/h4&gt;
  
      &lt;button ng-click="count = count + 1" ng-init="count=0"&gt;
        Increase
      &lt;/button&gt;
      &lt;br&gt;
      &lt;button ng-click="count = count - 1" ng-init="count=0"&gt;
        Decrease
      &lt;/button&gt;
      &lt;br&gt;&lt;br&gt;
    &lt;/h3&gt;
    &lt;button class="button" &gt;Add&lt;/button&gt;
  
  &lt;/div&gt;
  &lt;/center&gt;
  </code></pre>
  
  <p></p>
  
  <pre><code>(function() {
    var app = angular.module('store', [ ]);
  
    app.controller('StoreController', function(){
      this.products = items;
    });
  
    var items = [
      { item: 'Top', number: 2, images: 'shirt_icon.jpeg' },
      { item: 'Bottom', number: 5, images: 'pants_icon.jpg' },
      { item: 'Underwear', number: 3, images: 'underwear_icon.jpg' },
    ];
  
  })();
  </code></pre>
  
  <p>But what I really want is to have a simple "next" button that will populate the same page with all of the product information next in the array.</p>