How to Setup AngularJS Application?

Let us observe actual parts of a AngularJS application before we start creating HelloWorld application using AngularJS. An AngularJS application consists of following three important parts −

  • ng-app − This is a directive which defines and links an AngularJS application to HTML.
  • ng-model − This is a directive which binds the values of AngularJS application data to HTML input controls.
  • ng-bind − This is a directive which binds the AngularJS Application data to HTML tags.

Steps to create new AngularJS Application

Step 1 − Loading framework

Since it is a pure JavaScript framework, It can be added using <Script> tag.

 

Step 2 − Define AngularJS Application using ng-app directive

 

Step 3 − Defining a model name using ng-model directive

 

Step 4 − Bind the value of above model using ng-bind directive.

 

Steps to run AngularJS Application

Use above mentioned three steps in an HTML page.
testAngular.html

Result would be as followed.
Open testAngular.html in a web browser. Enter your name and see the result.

Sample Application

Enter your Name:

Hello !

Close