Lets start creating a basic angular js app with a “Hello world”.
Set-up required creating an Angular JS app:
Set-up required running an Angular JS app:
- Any browser [IE, Google chrome, Mozilla etc..]
These are the minimum basic setup required to create and run
an Hello world Angular app, when it comes to a larger sized app there we need
some other setup and minimum knowledge in other frameworks and technologies,
which we will discuss in the next blog.
Ok.., hope you are ready with the above setup. Before making
our hands dirty, lets know some facts about Angular JS1.
- Angular JS framework.
- Angular JS comes a normal JavaScript file.
- Angular JS app will be built with JavaScript.
- AngularJS extends HTML with new attributes.
- AngularJS is perfect for Single Page Applications (SPAs).
- AngularJS is easy to learn.
Now lets dive into writing the app.
File structure of the app as below:
Hello-world-app
|---/js
| |---app.js
|---index.html
js/app.js :
var app = angular.module(‘helloWorldApp’,[]);
app.contoller(‘helloWorldController’,[‘$scope’,function($scope){
$scope.data = “Hello
world !!!!!”;
}]);
Index.html :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello world Angular App</title>
</head>
<body>
<div
ng-app="helloWorldApp">
<div
ng-controller="helloWorldController">
<p>{{data}}</p>
</div>
</div>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular.min.js"></script>
</html>
Now run the
index.html file in browser and you will see the output as “Hello world !!!!!”
