Learning Angular: A Hands-On Guide to Angular 2 and Angular 4

Learning Angular, Second Edition

A Hands-On Guide to Angular 2 and Angular 4

Learning Angular teaches modern application development with Angular 2 and Angular 4. It begins with the basics of Angular and the technologies and techniques used throughout the book, such as key features of TypeScript, newer ES6 syntax and concepts, and details about the tools needed to write professional Angular applications.

The reader will next build an Angular application from scratch while learning about the primary pieces of an Angular application and see how they work together. Using lots of examples, the core parts of Angular will be introduced, such as Components, the Router, and Services.

The book also covers techniques like server-side rendering and how to incrementally add Angular 2+ features to existing AngularJS applications. Finally, the reader will gain insight into advanced skills that should be part of any professional Angular developer's toolkit such as testing, tooling options, and performance tuning.

Understand how Angular is organized and learn best practices for designing Angular applications
Quickly build Angular templates with built-in directives that enhance the user experience
Bind UI elements to your data model, so changes to your model and UI occur automatically in tandem
Define custom Angular directives that extend HTML
Implement zoomable images, expandable lists, and other rich UI components
Implement client-side services that interact with web servers
Build dynamic browser views to provide even richer user interaction
Create custom services you can easily reuse
Implement rich UI components as custom Angular directives

Contents at a Glance

Introduction

What is Angular
Why Use Angular
Who this Book is For
How to Use this Book
Getting the Source Code

Chapter 1: Jumping into JavaScript

Setting Up a JavaScript Development Environment
Defining Variables
Understanding JavaScript Data Types
Using Operators
Implementing Looping
Creating Functions
Understanding Variable Scope
Using JavaScript Objects
Manipulating Strings
Working with Arrays
Adding Error Handling

Chapter 2: Jumping into TypeScript

Learning the Different Types
Understanding Interfaces
Implementing Classes
Implementing Modules
Understanding Functions

Chapter 3: Getting Started with Angular

Why Angular?
Understanding Angular
Separation of Responsibilities
Adding Angular to Your Environment
Using the Angular CLI
Creating a Basic Angular Application

Chapter 4: Angular Components

Component Configuration
Building the Template
Using Constructors
Using External Templates
Implementing Directives

Chapter 5: Expressions

Using Expressions
Using Pipes
Building a Custom Pipe

Chapter 6: Data Binding

Understanding Data Binding
Interpolation
Property Binding
Attribute Binding
Class Binding
Style Binding
Event Binding
Two-Way Binding

Chapter 7: Built-in Directives

Understanding Directives
Using Built-in Directives
Structural Directives
Attribute Directives

Chapter 8: Custom Directives

Creating a Custom Attribute Directive
Creating a Custom Directive with a Component

Chapter 9: Events and Change Detection

Using Browser Events
Emitting Custom Events
Using Observables

Chapter 10: Implementing Angular Services in Web Applications

Understanding Angular Services
Using the Built in Services
Sending HTTP GET and PUT Requests with the http Service
Implementing a Simple Mock Server Using the http Service
Changing Views with the router Service
Implementing a Router with a Navigation Bar
Implementing a Router with Parameters

Chapter 11: Creating Your Own Custom Angular Service

Integrating Custom Services into Angular Applications
Implementing a Simple Application That Uses a Constant Data Service
Implementing a Data Transform Service
Implementing a Variable Data Service
Implementing a Service that Returns a Promise
Implementing a Shared Service

Chapter 12: Having Fun with Angular

Implementing an Angular Application That Uses the Animation Service
Implementing an Angular Application That Zooms in on Images
Implementing an Angular Application That Enables Drag and Drop
Implementing a Star Rating Angular Component