It's easy to use Angular , I think it's more easy and fun than jquery , so let's see a basic example .
//javascript.js file
//index.html
- To create basic Angular app you have to create a module then attached Controller to it, in your script you can define your module name and your controller like this :
//javascript.js file
angular.module('myApp',
[]).controller('myController',
function ($scope) {
//write whatever code and functions herer
});
- In your html page or in your main page refer to your module in <html> attrubite or <body> and refer to your controller in the section that you need to integrate with that controller like this :
//index.html
<html ng-app="myApp">
<head>
</head>
<body ng-controller="myController">
</body>
</html>
- back to your script , use $scope as var , it may hold array or function :
//javascript.js file
angular.module('myApp',
[]).controller('myController',
function ($scope) {
$scope.numbers = [1, 2, 3, 4];
$scope.alertnum = function (num) {
alert('you have clicked : ' + num)
};
});
- Use ng-repeat to loop through $scope.numbers in Dom and ng-click to invoke $scope.alertnum like this :
//index.html
<html ng-app="myApp">
<head>
</head>
<body ng-controller="myController">
<div
ng-repeat="num in numbers">
<a ng-click="alertnum(num)" href="#">
{{num}}
</a>
</div>
</body>
</html>
- here is a working example