Nowadays AngularJS is one of most popular and highly demanded JavaScript framework. If you are not going to learn this framework then you are missing one of cool features in web development.

It is very easy to learn. Before learning this topic ensure that you are comfortable with HTML and JavaScript.

Software requirement

Note: You can use any editor such as Notepad++, Notepad or Visual Studio any version editor, but if you are going to use Visual Studio 2015, then you will get lots of syntax intelligence benefits.

Introduction

Advantages

History

  1. Angular VS 1.0 released in 2012.
  2. Developed by Miško Hevery, a Google employee.

AngularJS sample code

Type the following code in your favorite editor.


Figure 1: AngularJS Sample

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title></title>
  5. <meta charset="utf-8" />
  6. <script src="../Scripts/angular.min.js"></script>
  7. </head>
  8. <body>
  9. <div ng-app>
  10. <p>Name:
  11. <input type="text" ng-model="name" />
  12. </p>
  13. <B>Hello: ng-bind =”name” </B>
  14. </div>
  15. </body>
  16. </html>
Output



Figure 2:
Output

Explanation

In the above example you have seen.

Other Sample for same functionality using binding expression

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title></title>
  5. <meta charset="utf-8" />
  6. <script src="../Scripts/angular.min.js"></script>
  7. </head>
  8. <body>
  9. <div ng-app>
  10. <p>Name:
  11. <input type="text" ng-model="name" />
  12. </p>
  13. <b> Hello: {{name}} </b>
  14. </div>
  15. </body>
  16. </html>
Explanation

Summary

In the above example, we learn the basic concepts of AngularJs.