1. AngularJS is a very powerful JavaScript Framework. It is used in
Single Page Application (SPA) projects. It extends HTML DOM
with additional attributes and makes it more responsive to user
actions. AngularJS is open source, completely free, and used by
thousands of developers around the world. It is licensed under
the Apache license version 2.0.
2. Prerequisites
Before you learn AngularJS, you should have a basic
understanding of:
HTML
CSS
JavaScript
3. AngularJS History
AngularJS version 1.0 was released in 2012.
Miško Hevery, a Google employee, started to work with
AngularJS in 2009.
The idea turned out very well, and the project is now
officially supported by Google.
4. Introduction
AngularJS is a JavaScript framework. It can be added
to an HTML page with a <script> tag.
AngularJS extends HTML attributes with Directives,
and binds data to HTML with Expressions.
5. AngularJS extends HTML with ng-directives.
The ng-app directive defines an AngularJS
application.
The ng-model directive binds the value of HTML
controls (input, select, textarea) to application data.
The ng-bind directive binds application data to the
HTML view.
6. AngularJS Applications
AngularJS modules define AngularJS applications.
AngularJS controllers control AngularJS applications.
The ng-app directive defines the application, the ng-
controller directive defines the controller.
7. Controllers
In Angular, a Controller is defined by a
JavaScript constructor function that is used to
augment the Angular Scope.
When a Controller is attached to the DOM via the ng-
controller directive, Angular will instantiate a new
Controller object, using the specified
Controller's constructor function. A new child
scope will be created and made available as an
injectable parameter to the Controller's constructor
function as $scope
8. Data Binding
Data-binding in Angular apps is the automatic
synchronization of data between the model and view
components.
The way that Angular implements data-binding lets
you treat the model as the single-source-of-truth in
your application.
The view is a projection of the model at all times.
When the model changes, the view reflects the
change, and vice versa.
9. Services
Angular services are substitutable objects that are wired
together using dependency injection (DI). You can use
services to organize and share code across your app.
Angular services are:
Lazily instantiated – Angular only instantiates a service
when an application component depends on it.
Singletons – Each component dependent on a service gets a
reference to the single instance generated by the service
factory.
Angular offers several useful services (like $http), but for
most applications you'll also want to create your own.
10. What are Scopes?
Scope is an object that refers to the application model.
It is an execution context for expressions. Scopes are
arranged in hierarchical structure which mimic the
DOM structure of the application. Scopes can
watch expressions and propagate events.
11. Templates
In Angular, templates are written with HTML that contains Angular-
specific elements and attributes. Angular combines the template with
information from the model and controller to render the dynamic view
that a user sees in the browser.
These are the types of Angular elements and attributes you can use:
Directive — An attribute or element that augments an existing DOM
element or represents a reusable DOM component.
Markup — The double curly brace notation {{ }} to bind expressions to
elements is built-in Angular markup.
Filter — Formats data for display.
Form controls — Validates user input.
