Angular JS seed

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap.min.css">
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>
<div ng-controller="rectangles">
</div>

JavaScript

var app = angular.module('myModule', [])
app.controller("rectangles", function($scope, $q, $timeout) {

	f1().then(function() {
		console.log("done");
	});

	function f1(counter) {

		if (!counter) {
			counter = 0;
		}

		counter++;
		console.log(counter);

		return asyncFunc().then(function() {
			if (counter < 10) {
				return f1(counter);
			} else {
				return;
			}
		});

	}

	function asyncFunc() {
		var deferred = $q.defer();

		$timeout(function() {
			deferred.resolve();
		}, 100);

		return deferred.promise;
	}

});