Table of Contents

Introduction

Who Should Read This Book

Why You Should Read This Book

What You Will Learn from This Book

What Is AngularJS?

How Is This Book Organized?

Getting the Code Examples

Finally

1 Jumping Into JavaScript

Setting Up a JavaScript Development Environment Using Node.js

Setting Up Node.js

Using Node.js to Run JavaScript

Creating an Express Web Server Using Node.js

Defining Variables

Understanding JavaScript Data Types

Using Operators

Arithmetic Operators

Assignment Operators

Applying Comparison and Conditional Operators

Implementing Looping

while Loops

do/while Loops

for Loops

for/in Loops

Interrupting Loops

Creating Functions

Defining Functions

Passing Variables to Functions

Returning Values from Functions

Using Anonymous Functions

Understanding Variable Scope

Using JavaScript Objects

Using Object Syntax

Creating Custom Defined Objects

Using a Prototyping Object Pattern

Manipulating Strings

Combining Strings

Searching a String for a Substring

Replacing a Word in a String

Splitting a String into an Array

Working with Arrays

Combining Arrays

Iterating Through Arrays

Converting an Array into a String

Checking Whether an Array Contains an Item

Adding Items to and Removing Items from Arrays

Adding Error Handling

try/catch Blocks

Throwing Your Own Errors

Using Finally

Summary

2 Getting Started with AngularJS

Why AngularJS?

Understanding AngularJS

Modules

Scopes and the Data Model

Views with Templates and Directives

Expressions

Controllers

Data Binding

Services

Dependency Injection

Compiler

An Overview of the AngularJS Life Cycle

The Bootstrap Phase

The Compilation Phase

The Runtime Data Binding Phase

Separation of Responsibilities

Integrating AngularJS with Existing JavaScript and jQuery

Adding AngularJS to Your Environment

Bootstrapping AngularJS in an HTML Document

Using the Global APIs

Creating a Basic AngularJS Application

Loading the AngularJS Library and Your Main Module

Defining the AngularJS Application Root Element

Adding a Controller to the Template

Implementing the Scope Model

Using jQuery or jQuery Lite in AngularJS Applications

What Is jQuery Lite?

Accessing jQuery or jQuery Lite Directly

Accessing jQuery or jQuery Lite Directly

Summary

3 Understanding AngularJS Application Dynamics

Looking at Modules and Dependency Injection

Understanding Modules

Dependency Injection

Defining an AngularJS Module Object

Creating Providers in AngularJS Modules

Specialized AngularJS Object Providers

Service Providers

Implementing Providers and Dependency Injection

Injecting a Built-in Provider into a Controller

Implementing a Custom Provider and Injecting It into a Controller

Applying Configuration and Run Blocks to Modules

Adding Configuration Blocks

Adding Run Blocks

Implementing Configuration and Run Blocks

Summary

4 Implementing the Scope as a Data Model

Understanding Scopes

The Relationship Between the Root Scope and Applications

The Relationship Between Scopes and Controllers

The Relationship Between Scopes and Templates

The Relationship Between Scope and Back-End Server Data

The Scope Life Cycle

Implementing Scope Hierarchy

Summary

5 Using AngularJS Templates to Create Views

Understanding Templates

Using Expressions

Using Basic Expressions

Interacting with the Scope in Expressions

Using JavaScript in AngularJS Expressions

Using Filters

Using Built-in Filters

Using Filters to Implement Ordering and Filtering

Creating Custom Filters

Summary

6 Implementing Directives in AngularJS Views

Understanding Directives

Using Built-in Directives

Directives That Support AngularJS Functionality

Directives That Extend Form Elements

Directives That Bind the Model to Page Elements

Directives That Bind Page Events to Controllers

Summary

7 Creating Your Own Custom Directives to Extend HTML

Understanding Custom Directive Definitions

Defining the Directive View Template

Restricting Directive Behavior

Adding a Controller to a Directive

Configuring the Directive Scope

Transcluding Elements

Manipulating the DOM with a Link Function

Manipulating the DOM with a Compile Function

Implementing Custom Directives

Manipulating the DOM in Custom Directives

Implementing Event Handlers in a Custom Directive

Implementing Nested Directives

Summary

8 Using Events to Interact with Data in the Model

Browser Events

User Interaction Events

Adding $watches to Track Scope Change Events

Using $watch to Track a Scope Variable

Using $watchGroup to Track Multiple Scope Variables

Using $watchCollection to Track Changes to Properties of an Object in the Scope

Implementing Watches in a Controller

Emitting and Broadcasting Custom Events

Emitting a Custom Event to the Parent Scope Hierarchy

Broadcasting a Custom Event to the Child Scope Hierarchy

Handling Custom Events with a Listener

Implementing Custom Events in Nested Controllers

Summary

9 Implementing AngularJS Services in Web Applications

Understanding AngularJS Services

Using the Built-in Services

Sending HTTP GET and PUT Requests with the $http Service

Using the $cacheFactory Service

Implementing Browser Alerts Using the $window Service

Interacting with Browser Cookies Using the $cookieStore Service

Implementing Timers with $interval and $timeout Services

Using the $animate Service

Using the $location Service

Using the $q Service to Provide Deferred Responses

Summary

10 Creating Your Own Custom AngularJS Services

Understanding Custom AngularJS Services

Defining a value Service

Defining a constant Service

Using a Factory Provider to Build a factory Service

Using an Object to Define a service Service

Integrating Custom Services into Your AngularJS Applications

Implementing a Simple Application That Uses All Four Types of Services

Implementing Simple Time Service

Implementing a Database Access Service

Summary

11 Creating Rich Web Application Components the AngularJS Way

Building a Tabbed View

Implementing Draggable and Droppable Elements

Adding a Zoom View Field to Images

Implementing Expandable and Collapsible Elements

Adding Star Ratings to Elements

Summary

A Testing AngularJS Applications

Deciding on a Testing Platform

Understanding AngularJS Unit Tests

Dependencies and Unit Tests

Testing Controllers with User Input Bound to Scope Data

Testing Filters

Testing Simple Directives

Testing Custom Directives That Use Transclusion

Testing Directives that Use External Templates

Understanding AngularJS End-to-End Testing

Index