AngularJS 1 Introduction

1 - Introduction to AngularJS

What is AngularJS?

Why AngularJS?

Scope and Goal of AngularJS

Using AngularJS

A Very Simple AngularJS Application

Building Blocks of an AngularJS Application

Use of Model View Controller (MVC) Pattern

A Simple MVC Application

The View

The Controller

Data Binding

Basics of Dependency Injection (DI)

Other Client Side MVC Frameworks

2 - AngularJS Module

What is a Module?

Benefits of Having Modules

Life Cycle of a Module

The Configuration Phase

The Run Phase

Module Wide Data Using Value

Module Wide Data Using Constant

Module Dependency

Using Multiple Modules in a Page

3 - AngularJS Controllers

Controller Main Responsibilities

About Constructor and Factory Functions

Defining a Controller

Using the Controller

Controller Constructor Function

More About Scope

Example Scope Hierarchy

Using Scope Hierarchy

Modifying Objects in Parent Scope

Modified Parent Scope in DOM

Handling Events

Another Example for Event Handling

Storing Model in Instance Property

4 - AngularJS Expressions

Expressions

Operations Supported in Expressions

AngularJS Expressions vs JavaScript Expressions

AngularJS Expressions are Safe to Use!

What is Missing in Expressions

Considerations for Using src and href Attributes in Angular

Examples of ng-src and ng-href Directives

5 - Basic View Directives

Introduction to AngularJS Directives

Controlling Element Visibility

Adding and Removing an Element

Dynamically Changing Style Class

The ng-class Directive

Example Use of ng-class

Setting Image Source

Setting Hyperlink Dynamically

Preventing Initial Flash

6 - Advanced View Directives

The ng-repeat Directive

Example Use of ng-repeat

Dynamically Adding Items

Special Properties

Example: Using the $index Property

Scope and Iteration

Event Handling in Iterated Elements

The ng-switch Directive

Example Use of ng-switch

Inserting External Template using ng-include

7 - Working with Forms

Forms and AngularJS

Scope and Data Binding

Role of a Form

Using Input Text Box

Using Radio Buttons

Using Checkbox

Using Checkbox - Advanced

Using Select

Using Select – Advanced

Disabling an Input

Reacting to Model Changes in a Declarative Way

Example of Using the ng-change Directive

8 - Formatting Data with Filters in AngularJS

What are AngularJS Filters?

The Filter Syntax

Angular Filters

More Angular Filters

Using Filters in JavaScript

Using Filters

A More Complex Example

The date Filter

The date's format Parameter

Examples of Using the date Filter

The limitTo Filter

Using limitTo Filter

Filter Performance Considerations

9 - AngularJS $watch Scope Function

The $watch Function

The $watch Function Signature

The $watch Function Details

Cancelling the Watch Action

Example of Using $watch

Things to be Aware Of

More Things to Be Aware Of

Performance Considerations

Speeding Things Up

10 - Communicating with Web Servers

The $http AngularJS Service

The Promise Interface

The $http Service

$http Function Invocation

Callback Parameters

Request Configuration Properties

Shortcut Methods

Complete List of Shortcut Methods

Using $http.get()

Working with JSON Response

Using $http.post()

Combining $http POST Request Data with URL Parameters

The then() Method of the Promise Object

The Response Object

Making Parallel Web Service Calls

Combining Multiple Promises into One

Wait for the Combined Promise

Setting Up HTTP Request Headers

Caching Responses

Disabling Caching in IE9

Setting the Request Timeout

11 - Custom Directives

What are Directives?

Directive Usage Types

Directive Naming Convention

Defining a Custom Directive

Using the Directive

Scope of a Directive

Isolating Scope

Example Scope Isolation

Using External Template File

Manipulating a DOM Element

The Link Function

Event Handling from a Link Function

Wrapping Other Elements

Accepting a Callback Function

Supplying Callback Function