Search⌘ K
AI Features

Services, Interceptors, and Guards

Explore how to create and use Angular services for data handling, interceptors for managing HTTP requests, and various route guards to control user access and navigation in an Angular application. Understand these key concepts to enhance app security and functionality.

What is a service?

An Angular service is simply a class created to configure the logic in which an application can access data. They’re implemented through dependency injection and can be used across multiple components.

Angular services interact with back-end REST APIs to implement HTTP methods like PUT, POST, DELETE, PATCH, and GET to create CRUD operations.

Setting up an Angular service

Creating a service in Angular is relatively easy. We can do this by using the following command in the Angular CLI below:

ng generate service test

📝 Note: Click the terminal window below to see this in action

Terminal 1
Terminal
Loading...

In the terminal above, we’re able to generate a new service called test. The architecture can be seen below:

{
  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=827846
  "recommendations": ["angular.ng-template"]
}
Angular Service architecture

What is an interceptor?

Angular interceptors are a unique type of Angular service that help us to intercept incoming or outgoing HTTP requests using the HttpClient. Angular allows us to modify this request when it’s intercepted, ...