In the below of code we have used ng-repeat angualr directive which will be repeat every time in the array which has been created and with the help of $scope object we will make communication between the html elementes and Controller.
<!DOCTYPE html>
<head>
<title>Welcome For Learn Ng-Repeat Directive/title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script>
</head>
<body ng-app="app">
<div ng-controller="StudentListCtrl">
<ul>
<li ng-repeat="student in students">{{student.name}}</li>
</ul>
</div>
<script>
var app = angular.module("app", []);
app.controller('StudentListCtrl', ['$scope', function ($scope) {
$scope.students = [{ name: 'Sunil' }, { name: 'Kamal' }, { name: 'Rajesh' },
{ name: ' Arpan' }, { name: 'Amit' }];
}]);
</script>
</body>
</html>
-------------------
OUTPUT: -
<!DOCTYPE html>
<head>
<title>Welcome For Learn Ng-Repeat Directive/title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script>
</head>
<body ng-app="app">
<div ng-controller="StudentListCtrl">
<ul>
<li ng-repeat="student in students">{{student.name}}</li>
</ul>
</div>
<script>
var app = angular.module("app", []);
app.controller('StudentListCtrl', ['$scope', function ($scope) {
$scope.students = [{ name: 'Sunil' }, { name: 'Kamal' }, { name: 'Rajesh' },
{ name: ' Arpan' }, { name: 'Amit' }];
}]);
</script>
</body>
</html>
-------------------
OUTPUT: -
- Sunil
- Kamal
- Rajesh
- Arpan
- Amit
very nice sir.
ReplyDelete