AngularJS Environment : Setup

In the last chapter we have learnt about the Angular JS introduction and Basic Example of the Angular JS.

Angular JS Environment Setup :

  1. Angular JS is client side scripting language.
  2. Angular JS is a JavaScript framework.
  3. Angular JS library is written in JavaScript.
  4. Angular JS comes in minified and non minified file we need to simply add it to the page using script tag.

AngularJS in Head Tag :

Consider the following example -

<!DOCTYPE html>
<html ng-app>
<head>
    <title>AngularJS Introduction</title>
    <script src="angular.min.js"></script>
</head>
<body>
    Enter your name :
    <input type="text" ng-model="yourname" />
    <h1>Hello {{ yourname }}</h1>
</body>
</html>

AngularJS in Body Tag :

We have placed the angular js code in the head tag of the page. It is re-commended to put javascript code in the bottom of the page.

<!DOCTYPE html>
<html ng-app>
<head>
    <title>AngularJS Introduction</title>
</head>
<body>
    Enter your name :
    <input type="text" ng-model="yourname" />
    <h1>Hello {{ yourname }}</h1>
	<script src="angular.min.js"></script>	
</body>
</html>

If we include the Angular JS code at the bottom of the body tag then it will improves page loading as HTML loading will not be blocked by scripts loading.

Output :