<!doctype html>
<html ng-app="CounterApp">
<head>
<title>Example - www.code-sample.com</title>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.1/angular.min.js"></script>
<script>
angular.module('CounterApp', [])
.controller('CounterController', ['$scope', function ($scope) {
$scope.CounterRows = [
{ name: 'Row1', web: 'www.code-sample.com' },
{ name: 'Row2', web: 'www.code-sample.net' },
{ name: 'Row3', web: 'www.code-sample.in' },
{ name: 'Row4', web: 'www.code-sample.co.in' },
{ name: 'Row5', web: 'www.code-sample.org' }];
$scope.AddRows = function () {
$scope.CounterRows.push({ name: 'Row7', web: 'www.code-sample.org' });
}
}]);
</script>
</head>
<body ng-controller="CounterController">
<div>
<input type="button" value="Add new rows!!" ng-click="AddRows()" />
</div>
<div ng-repeat="row in CounterRows">
<div>{{$index +1}} : {{row.name}}</div>
</div>
</body>
</html>
// Code goes here
/* Styles go here */