9/11 ng-click I - Bugged list view from ng-repeat?


#1
<div ng-repeat="product in products" class="col-md-6">
  <div class="thubnail">
    <img ng-src="{{ product.cover }}">
    <p class="title">{{ product.name }}</p>
    <p class="price">{{ product.price | currency }}</p>
    <p class="date">{{ product.pubdate | date }}</p>
      <div class="rating">
        <p class="likes" ng-click="plusOne($index)">+ {{ product.likes }}</p>
      </div>
   </div>
</div>

The above code works fine, except for this part:

<div class="rating">
  <p class="likes" ng-click="plusOne($index)">+ {{ product.likes }}</p>
</div>

All the generated elements inside <div ng-repeat="product in products" class="col-md-6"> show up perfectly fine, however the aforementioned rating-block generates the content one index too far, as in the topmost "book" doesn't get a rating, but there's a rating floating by itself below the last "book". Does anyone else experience this? I'm running the course on Chrome version 48.0.2564.109 m. Would attach a screenshot if I knew how to.


#2

As a side-note: When adding the next lessons <p class="dislikes"> the view got even more buggy. Now no likes are displayed except the lone, bottom one, and the dislikes are displayed instead. Top "book" is still without a likes- or dislikes-element.