We only need one html file for this. We can also use three files for this purpose.
1. Angular.js file – this is the main javascript file we need to make page support for Angular js. We can include it in our folder or we can directly take it from CDN.
2. Basic Html file – this file should contain ng-app in any HTML tag. ng-controller,ng-repeat and {{variable}} are code syntaxes.
3. CardController.js file - this file contains controller class and with $scope variable it defines its parameters.
<html ng-app xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<!--<script src="scripts/angular.min.js"></script>-->
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js"></script>
<script language="javascript">
//we can also use CardController.js for this
var CardController = function ($scope) {
$scope.cards = [{ Id: 1 }, { Id: 4 }];
};
</script>
</head>
<body ng-controller="CardController">
<div ng-repeat="card in cards" class="CardItem">
Id: {{card.Id}}
</div>
</body>
</html>
Output will be
Id: 1
Id: 4
Hope you wanted to learn more simple beginners lessons on AngularJS covering most parts with examples. W3Cschools.com - http://www.w3schools.com/angular/default.asp
No comments:
Post a Comment