Category: Creating services

REST API consumption – Angular Services and the Singleton Pattern-2

For the inclusion of a new set, we are using the POST method of the service that calls the API with the verb of the same name. We always pass the URL and, in this…

Using the inject() function – Angular Services and the Singleton Pattern

The inject() function allows you to use the same dependency injection feature but in a simpler way.Let’s refactor our component’s code: import { Component,inject} from ‘@angular/core’;import { ExerciseSet } from ‘../interfaces/exercise-set’;import { ExerciseSetsService } from…

Understanding the dependency injection pattern – Angular Services and the Singleton Pattern

In object-oriented software development, it is good practice to prioritize composition over inheritance, meaning that a class should be composed of other classes (preferably interfaces).In our previous example, we can see that the service class…

Communication from the child component – using @Output – Components and Pages

We studied how parent components, which can be either smart or presentational, can communicate with their child components by using attributes marked with the @Input decorator.However, when we need the opposite, the child component passes…

Separating responsibilities – Smart and Presentation components – Components and Pages

The information flow of a single-page application (SPA) can be quite complex and, if you don’t think about this flow from the beginning of your design, it can affect the productivity and quality of your…

Using a better alternative to the any type – TypeScript Patterns for Angular

In the development of TypeScript applications, we may have situations where we do not know which type of parameter we are going to receive, such as the return of an API. What is trafficked can…

Validating types – type guards – TypeScript Patterns for Angular

Now that we know the TypeScript inference mechanism, we can understand another feature present in it, type guards. Let’s consider these in the following example:function getDiscount(value: string | number) { if (typeof value === “number”) { return…

Working with null values – TypeScript Patterns for Angular

In TypeScript, by default, all function and method parameters are required and checked by the transpiler.If any parameter is optional, we can define it in the type it represents, as in the following example: function…

Primitive and basic types – TypeScript Patterns for Angular

JavaScript, despite not being a strongly typed language, has three types called primitives: For each of these primitive types, TypeScript already has a datatype that represents them, namely, Boolean, String, and Number, respectively. Important The…

Creating classes and types – TypeScript Patterns for Angular

Since version 2 of the framework, Angular is based on TypeScript for its development, both internally and for those who use it to build applications. This was a controversial decision at the time, as this…