First Step For Angular Js

AngularJs is developed and maintained by Google to allow developers to develop well architectured and easily maintainable web-applications. It is nothing different to plain HTML but simply an extension to HTML with new attributes.

AngularJS is a framework for dynamic web applications and it is client-sided so all these things are happening in browsers and you get the elegance of standalone application. AngularJS makes use of declarative programming for building UI.



Lets start using AngularJs.

Download AngularJs from this site and you can find examples and more in there.
  1. Download Angular
  2. Add a reference to your AngularJs file
    ex: <script src="scripts/angular.min.js"></script>
  3. Then add "ng-app" attribute to an element that you want to usu angular in.
    In this example we have used it in body tag
    "ng-app" is called a directive in angular. There are many such directives in angular. You can find a complete list from here. This is a starting point of AngularJs app Angular framework will first check for this directive home where in the html page, If found Angular bootstrap itself  
  4. Then we can use angular binding expressions inside that element
Examples for angular binding expressions
  • To evaluate mathematical expressions
    {{10+20}}
  • To retrieve a element from an array
    {{['Jhon','Peter','Sandy'][2]}}
Here is the HTML code after completing

<!DOCTYPE html>
<html>
    <head>
        <script src="scripts/angular.min.js"></script>
    </head>
    <body ng-app>
        <div>
            {{10+20}}
            <br/>            
            {{['Jhon','Peter','Sandy'][2]}}
        </div>
    </body>
</html>

You can find the Complete project from this link

No comments:

Post a Comment