AngularJS  is a structural framework for dynamic web applications.

It lets you use HTML as your template language and lets you extend HTML’s syntax to express your application’s components clearly and succinctly. AngularJS’s data binding and dependency injection eliminate much of the code you would otherwise have to write. And it all happens within the browser, making it an ideal partner with any server technology.

AngularJS is a full featured JavaScript framework, with the core goal of simplification. It excels at building dynamic, single page web apps (SPAs) and supports the Model View Controller (MVC) programming structure. It powers sites include Google, Virgin America, and HBO’s mobile site for iPad.

Other highlights:

  • Open-source, front-end JavaScript framework developed by Google
  • A library of JavaScript code based on standard JS and HTML, with minimal modifications (meaning, it’s less likely to break)
  • Handles the heavy lifting of DOM manipulation and AJAX glue that once had to be coded from scratch
  • Encourages the developer to use modular building blocks of JavaScript code that can be categorized and are easy to test
  • Can be added to any HTML page with a <script> tag

HOW ANGULARJS APPLICATION LOADS?

AngularJS application gets initialized when DOMContentLoaded events gets fired.A DOMContentLoded event is fired on the document when all the HTML elements are loaded and parsed.It does not wait for all the resources like images,styles and other to be downloaded to browser.Once this event is fired Angular executes the below steps.

  1. Angular looks for ngApp directives in the DOM tree. ngApp works like a marker to AngularJS, which tells the AngularJS that the portion of HTML markup needs compilation.
  2. If Angular finds multiple ngApp directives then it takes the 1st ngApp covered HTML portion and starts the process of auto-bootstrapping.In auto-bootstrapping all other depended modules and injectors gets loaded to the AngularJS application.
  3. The other remaining ngApp directives needs manual bootstrapping.A manual bootstrapping can be done using angular.bootstrap() method.

Once the ngApp root is determined the compilation process of HTML markup gets triggered by considering the ngApp element as the root of the application.During the compilation process it loads all the dependencies like injector or modules.