insert an element after a number of ng-repeat iteration - html

Question

Is there a way to avoid such use of ng-repeat.
To fix the issue ,I used two ng-repeat using the option limitTo to display each 3 element separately.
What I want to do is ,to insert my elements and after each 3 elements ,So I add
<div class="row"> </div>
Below is my code:
<div class="row">
<div class="col-md-10 col-md-offset-1">
<div class="row l-b-margin">
<div class="col-md-4" ng-repeat="name in Courses|limitTo:3">
<div class="well well-white">
<img alt="R Programming" class="center-block l-b-margin"
height="100" ng-src="{{name.logo}}" width="100" />
<h6 style="text-align: center; color: #516979; font-size: 21px">{{name.name}}</h6>
<p class="text-space l-b-margin">Write your first code here</p>
<a class="rounded-button cta-border-button center-block m-button"
href="courses/introduction-to-r">Start Course</a>
</div>
</div>
</div>
<div class="row">
<div class="col-md-4" ng-repeat="name in Courses|limitTo:-3">
<div class="well well-white">
<img alt="Data Manipulation" class="center-block l-b-margin"
height="100" ng-src="{{name.logo}}" width="100" />
<h6 style="text-align: center; color: #516979; font-size: 21px">{{name.name}}</h6>
<p class="text-space l-b-margin">Write your first code here</p>
<a class="rounded-button cta-border-button center-block m-button"
href="courses/data-table-data-manipulation-r-tutorial">Start
Course</a>
</div>
</div>
</div>
</div>
</div>

Answer 1

The simple way to do is use ($index+1)%3==0 with ng-if and put the below element at the end of ng-repeat.
<div class="row" ng-if="($index+1)%3==0"> </div>
Plunker
Hope it helps :)

Answer 2

What you're seem to be doing is trying to prevent this situation from happening: (some blocks shifts to the next row if not all have equal heights)
If that's the case you can (and should;) ) fix it via simple css: (just add a custom class to the div your iterating over)
.my-block:nth-child(3n+1) {
clear: left;
}