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