How to create simple AngularJS application?

In this article we will create simple simple AngularJS application that may be used as base for larger one.

  1. Add AngularJS script to page. You can find last version of AngularJS on the official site.

     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
    
  2. Add ng-app attribute to the tag. All content inside this tag will be interpreted as Angular application.

     <body ng-app>
    
  3. Add expression to tag that have ng-app attribute (or to inner tag). Expressions are placed inside double curly braces:

     {{ 1 + 2 }}
    
  4. If you open your new page in browser you will see the result: 3.

  5. Full code:

     <!DOCTYPE html>
     <html>
     <head>
         <meta charset="utf-8">
         <title>Simple angularJS project</title>
         <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
     </head>
     <body ng-app>
     {{ 1 + 2 }}
     </body>
     </html>
    
  6. Source code.

    Demo.

07.04.2018