Angular+JQ+Bootstrap

by everdimension

HTML

<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script src="http://code.angularjs.org/1.2.12/angular.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<div ng-controller="MyCtrl as ctr">
    <div class="row" ng-repeat="project in ctr.projects" ng-if="$index % 3 == 0">
         <h4 class="col-sm-4" ng-repeat="project in ctr.projects.slice($index, $index+3)">
            {{project}}
        </h4>
    </div>
</div>

CSS

.row {
    border-top: 1px dashed #aaa;
    padding: 15px;
}
.row:first-child {
    border-top: none;
}

JavaScript

var app = angular.module('myApp', []);

app.controller("MyCtrl", function () {

    this.projects = ["Anything", "Something", "Nothing",
                    "Random", "Systematic", "Letters",
                    "Sentences", "333333333", "I", 'w', '3'];

});