Angular Signal Examples

Demo

Interceptor

Service

Models

HTML

SCSS

Example 1: HTTP cache with interceptors

This example demonstrates the use of HTTP interceptors for caching API responses.

Basic Usage

Use Cache:

Current limit: 5 items

ID	Task	Status
1	delectus aut autem	Pending
2	quis ut nam facilis et officia qui	Pending
3	fugiat veniam minus	Pending
4	et porro tempora	Completed
5	laboriosam mollitia et enim quasi adipisci quia provident illum	Pending

Key Features

🔄 Automatic caching of API responses
⏳ Configurable cache expiration
📊 Optimized for performance and user experience
📚 Easily extendable for other API endpoints

This example uses a simple HTTP interceptor to cache GET requests and improve performance.

It demonstrates how to manage API data efficiently in Angular applications.


              const data$ = this.http.get('/sensitive/data', {
                context: new HttpContext().set(CACHING_CONFIG, {
                  enabled: true,
                  maxAge: 300000 // 5 minutes
                }),
              });