Introduction to AngularJS

M2-R5.1 · Chapter 6: JavaScript and Angular JS · 2 min read

Introduction to Angular Js 

  • AngularJS is a JavaScript framework maintained by Google for building dynamic, single‑page web applications (SPAs).

  • AngularJS was originally developed in 2009 by Miško Hevery and Adam Abrons at Brat Tech LLC

  • AngularJS extends HTML with new attributes.
  • AngularJS follows an MVC (Model-View-Controller) or MVW (Model-View-Whatever) architectural pattern
  • Advantages:

    • Reduces amount of code needed.

    • Provides structured development.

    • Easy to test and maintain

  • Use Cases:

  • Dynamic forms, dashboards, portals, and interactive web apps.

How to Use Angularjs?

There are two main methods to use AngularJS in your project:

1. CDN Method (Easiest & Recommended)

Just add the AngularJS CDN link inside your HTML <head> tag or at the end of <body>:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"></script>

2. Local Installation Method

  1. Go to AngularJS download link:
    https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js

  2. Right-click → Save As → Save it to your project folder (example: js/angular.min.js)

  3. Add the script in your HTML

             <script src="js/angular.min.js"></script>

___________________________________________________________________________________________________________________

Now add ng-app="" to activate AngularJS in your page:

<!DOCTYPE html>
<html ng-app="">
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"></script>
</head>
<body>

    <h2>{{ 5+2}}</h2>

</body>
</html>