7. Explaining Pipes and Communicating with RESTful Services | Getting Started with Angular - Second edition

Sign In Start Free Trial

Book Overview & Buying
Table Of Contents

Getting Started with Angular - Second edition - Second Edition

By : Minko Gechev

Getting Started with Angular - Second edition

By: Minko Gechev

Overview of this book

Want to build quick and robust web applications with Angular? This book is the quickest way to get to grips with Angular and take advantage of all its new features.

Preface

Preface

What this book covers

What you need for this book

Who this book is for

Conventions

Reader feedback

Customer support

Free Chapter

1. Get Going with Angular

1. Get Going with Angular

Angular and semver

The evolution of the Web - time for a new framework

The evolution of ECMAScript

Lessons learned from AngularJS in the wild

Summary

2. The Building Blocks of an Angular Application

2. The Building Blocks of an Angular Application

A conceptual overview of Angular

Changing directives

Getting to know Angular components

Angular modules

Pipes

Improving change detection

Services

The new router

Summary

3. TypeScript Crash Course

3. TypeScript Crash Course

Introduction to TypeScript

Using TypeScript

TypeScript syntax and features introduced by ES2015 and ES2016

Meta-programming with ES2016 decorators

Writing modular code with ES2015

ES2015 module loader

ES2015 and ES2016 recap

Taking advantage of static typing

Further expressiveness with TypeScript decorators

Writing generic code by using type parameters

Writing less verbose code with TypeScript's type inference

Using ambient type definitions

Summary

4. Getting Started with Angular Components and Directives

4. Getting Started with Angular Components and Directives

The "Hello world!" application in Angular

Using TypeScript

Playing with Angular and TypeScript

Using Angular directives

Improved semantics of the directives syntax

Defining Angular directives

Creating custom Angular components

Explaining Angular's content projection

Hooking into the component's life cycle

Defining generic views with TemplateRef

Understanding and enhancing the change detection

Summary

5. Dependency Injection in Angular

5. Dependency Injection in Angular

Why do I need DI?

DI in Angular

Configuring an injector

Defining factories for instantiating services

Child injectors and visibility

Summary

6. Working with the Angular Router and Forms

6. Working with the Angular Router and Forms

Developing the "Coders repository" application

Exploring the Angular router

Using Angular's forms module

Two-way data binding with Angular

Storing the form data

Listing all the stored data

Summary

7. Explaining Pipes and Communicating with RESTful Services

7. Explaining Pipes and Communicating with RESTful Services

Developing model-driven forms in Angular

Exploring the HTTP module of Angular

Defining parameterized views

Defining nested routes

Transforming data with pipes

Summary

8. Tooling and Development Experience

8. Tooling and Development Experience

Running an application in a Web Worker

Initial load of a SPA

Enhancing our development experience

Angular quick starters

AoT compilation in Angular

Summary

Developing model-driven forms in Angular

These will be the last steps for finishing the "Coders repository". You can build on top of the code available at ch6/ts/step-1/ (or ch6/ts/step-2, depending on your previous work), in order to extend the application's functionality with the new concepts we will cover. The complete example is located at ch7/ts/multi-page-model-driven.

This is the result that we will achieve by the end of this section:

Figure 1

In the preceding screenshot, there are two forms:

A form that contains the following controls for importing existing users from GitHub:
- The input for the GitHub handle.
- A checkbox that points out whether we want to import the developer from GitHub or enter it manually.
A form for entering new users manually.

The second form looks exactly the way we left it in the last chapter. However, this time, its definition looks a little bit different:

<form class="form col-md-4" [formGroup]="addDevForm" [hidden]="submitted">
  <!-- TODO --&gt...

CONTINUE READING

83

Tech Concepts

36

Programming languages

73

Tech Tools

Unlimited access to the largest independent learning library in tech of over 8,000 expert-authored tech books and videos.

Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.

50+ new titles added per month and exclusive early access to books as they are being written.

Getting Started with Angular - Second edition

Search

Your notes and bookmarks