Cover

Title Page

Copyright

Credits

Foreword

About the Author

www.PacktPub.com

Customer Feedback

Table of Contents

Preface

Chapter 1: Switching to the One Angular

Introducing the One Angular

From AngularJS to Angular

The new beginning

Angular and SemVer

Summary

Chapter 2: Get Going with Angular

The evolution of the web – time for a new framework

The evolution of ECMAScript

Web components

Web workers

Lessons learned from AngularJS in the wild

Controllers

Scope

Dependency injection

Server-side rendering

Applications that scale

Templates

Change detection

Summary

Chapter 3: The Building Blocks of an Angular Application

A conceptual overview of Angular

Changing directives

Getting to know Angular components

Components in action

Components in Angular

Angular modules

Bootstrapping an Angular application

Pipes

Defining pipes

Improving change detection

Classical change detection

Change detection in AngularJS

In zone.js

Simplified data flow

Enhancing AngularJS's change detection

Services

The new router

Angular route definition syntax

Summary

Chapter 4: TypeScript Crash Course

Introduction to TypeScript

Compile-time type checking

Better support by text editors and IDEs

There's even more to TypeScript

Using TypeScript

Installing TypeScript with npm

Running our first TypeScript program

TypeScript syntaxes and features introduced by ES2015 and ES2016

ES2015 arrow functions

Using the ES2015 and ES2016 classes

Defining variables with block scope

Meta-programming with ES2016 decorators

Using configurable decorators

Writing modular code with ES2015

Using the ES2015 module syntax

Taking advantage of the implicit asynchronous behavior of the module

Using aliases

Importing all the module exports

Default exports

ES2015 module loader

ES2015 and ES2016 recap

Taking advantage of static typing

Using explicit type declarations

The any type

Understanding the primitive types

The Enum types

Understanding the object types

The array types

The Function types

Defining classes

Using access modifiers

Defining interfaces

Interface inheritance

Implementing multiple interfaces

Further expressiveness with TypeScript decorators

Writing generic code using type parameters

Using generic functions

Having multiple type parameters

Writing less verbose code with the type inference of TypeScript

Best common type

Contextual type inference

Introducing structural typing

Using ambient type definitions

Using predefined ambient type definitions

Custom ambient type definitions

Summary

Chapter 5: Getting Started with Angular Components and Directives

The "Hello world!" application in Angular

Setting up our environment

Installing the sample project repository

Using Angular and TypeScript

Using Angular directives

The ngFor directive

Improved semantics of the directives syntax

Declaring variables inside a template

Using syntax sugar in templates

Defining Angular directives

Setting the directive's inputs

Understanding the directive's constructor

Better encapsulation of directives with NgModules

Using NgModules for declaring reusable components

Using the custom element schema

Creating custom Angular components

Introducing the component's view encapsulation

Implementing the component's controllers

Handling user actions

Using inputs and outputs

Determining the inputs and outputs

Defining the inputs and outputs

Passing inputs and consuming the outputs

Event bubbling

Renaming the inputs and outputs

An alternative syntax to define inputs and outputs

Explaining Angular's content projection

Basic content projection in Angular

Projecting multiple content chunks

Nesting components

Using view children and content children

View child versus content child

Hooking into the component's life cycle

Order of execution of the life cycle hooks

Defining generic views with TemplateRef

Understanding and enhancing the change detection

The order of execution of the change detectors

Understanding Angular's change detection strategies

Introducing immutable data structures and OnPush

Using immutable data in Angular

Summary

Chapter 6: Dependency Injection in Angular

Why do I need dependency injection?

Dependency injection in Angular

Benefits of using dependency injection

Declaring providers

Using the @Injectable decorator

Introducing forward references

Configuring providers

Using existing providers

Defining factories for instantiating services

Declaring optional dependencies

Understanding multiproviders

Child injectors and visibility

Instantiating an injector

Building a hierarchy of injectors

Using dependency injection with components and directives

Introducing the element injectors

Declaring providers for the element injectors

Exploring dependency injection with components

View providers versus providers

Using the @SkipSelf decorator

Summary

Chapter 7: Working with the Angular Router and Forms

Developing the "Coders repository" application

Exploring the Angular router

Using PathLocationStrategy

Configuring routes

Using routerLink and router-outlet

Lazy-loading with loadChildren

Prefetching of the lazy-loaded routes

RouterModule.forRoot versus RouterModule.forChild

Using Angular's forms module

Developing template-driven forms

Digging into the markup of the template-driven form

Using the built-in validators

Defining custom validators

Using select inputs with Angular

Using the NgForm directive

Two-way data binding with Angular

Storing the form data

Listing all the stored data

Summary

Chapter 8: Explaining Pipes and Communicating with RESTful Services

Developing model-driven forms in Angular

Using composition of control validators

Exploring the HTTP module of Angular

Using Angular's HTTP module

Defining parameterized views

Defining nested routes

Transforming data with pipes

Developing stateless pipes

Using Angular's built-in pipes

Developing stateful pipes

Using stateful pipes

Using Angular's AsyncPipe

Using AsyncPipe with observables

Summary

Chapter 9: Tooling and Development Experience

Running an application in a web worker

Web workers and Angular

Bootstrapping an application running in a web worker

Migrating an application to web workers

Making an application compatible with web workers

Initial load of a single-page application

Initial load of a single-page application with server-side rendering

Server-side rendering with Angular

Enhancing our development experience

Text editors and IDEs

Angular language service

Bootstrapping a project with angular-cli

Using angular-cli

Angular quick starters

Angular seed

Angular webpack starter

Ahead-of-time compilation in Angular

How code generation works

Introducing the concept of ahead-of-time compilation

Constraints of the ahead-of-time compilation

How to use the ahead-of-time compilation of Angular

Summary

Index