ng-repeat is used to iterate over the properties of an object. I am showing how you can use ng-repeat loops through an array from scope variables.
The below code uses ng-repeat in a list that takes values through an array from scope.
Here is the HTML:
<!DOCTYPE html>
<html lang="en"><head>
<meta charset="utf-8">
<link rel='stylesheet' href='css/weekdays.css' type='text/css' />
<script type="text/javascript" src="js/angular.min.js"></script>
<script src="js/weekdays.js"></script>
</head>
<body ng-app="mainApp">
<div class="wrapper" ng-controller="mycontroller">
<header>
<div class="left_foot">
<p class="para">Carrier</p>
</div>
<div class="a">
</div>
</header>
<main>
<section class="contact_1">
<p><b>Weekdays</b></p>
</section>
<div class="content">
<ul>
<li ng-repeat="week in weeks">
<button ng-click="displayMon()">{{week}}</button>
</li>
</ul>
</div>
</main>
</div>
</body>
</html>
You need to add the below code into your controller.
var myapp = angular.module('mainApp', []);
myapp.controller("mycontroller", function ($scope) {
$scope.weeks = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday','Saturday','Sunday'];
})
It will display a list showing the weekdays in an order.
0 Comment(s)