5. Dependency Injection in Angular | Getting Started with Angular - Second edition

Sign In Start Free Trial

Book Overview & Buying
Table Of Contents
Feedback & Rating

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

Customer Reviews

5 star

0

4 star

0

3 star

0

2 star

0

1 star

0

DI in Angular

Another way we can approach this is by taking advantage of the DI pattern. We're already familiar with it from AngularJS; let's demonstrate how we can refactor the preceding code using DI in the context of Angular:

class Engine {...} 
class Transmission {...} 
 
@Injectable() 
class Car { 
  engine; 
  transmission;
 
  constructor(engine: Engine, transmission: Transmission) { 
    this.engine = engine; 
    this.transmission = transmission; 
  } 
}

All we did in the preceding snippet was add the @Injectable class decorator on top of the definition of the Car class and provide type annotations for the parameters of its constructor.

Benefits of DI

There is one more step left, which we'll take a look at in the next section. Before that, let's take a look at what the benefits of the mentioned approach are:

We can easily pass different versions of the dependencies of the Car class for a testing environment, or for instantiating...

Visually different images

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