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…
Category: Exams of IT
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…
Creating services – Angular Services and the Singleton Pattern
Services in Angular are TypeScript classes that aim to implement business logic for our interfaces. Business logic in a frontend project can seem like a controversial issue because ideally, all logic and processing should take…
Propagating events from nested components – Components and Pages
We will add the options to delete an item from the list and increase the number of repetitions to our diary. First, let’s add the buttons to the list item template. In the entry-item.component.html file,…
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…
Best practice – using the TrackBy property – Components and Pages
After the *ngIf directive, the ngFor directive will probably be the directive that you will use the most in your Angular projects. Although simple, this directive can hide a performance and perception problem in the…
Communication between components – inputs and outputs – Components and Pages
In our gym diary application, we now need the workout list page component, DiaryComponent, to communicate with the list item component, EntryItemComponent. The simplest way to accomplish this communication is with Angular’s Property Binding concept.…
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…
Interfaces – TypeScript Patterns for Angular
In TypeScript, we have another way of typifying the structure of an object called an interface. The following example demonstrates its use: export interface Animal {species: string;kingdom: string;class: string;} To declare an interface, we use…
Classes – TypeScript Patterns for Angular
Building on our knowledge of basic types, let’s now create more complex data types. The first one we’re going to explore is classes. An essential element of object-oriented programming, the class represents a model, which…