How to use provideHttpClient with route-specific interceptors in Angular?

I'm trying to set up provideHttpClient in Angular v19 to use route-specific interceptors, but I'm encountering an issue where no requests are intercepted.

My Setup:


I have a default ApplicationConfig for my app:

// Default App Configuration
export const appConfig: ApplicationConfig = {
providers: [
// Other default Angular providers
provideHttpClient(),
provideRouter(routes),
],
};


In addition, I have lazy-loaded routes where I provide route-specific interceptors:

export const routes: Routes = [
// Lazy-loaded admin and chat feature routes
{
path: 'admin',
title: 'Admin Area',
providers: [
provideHttpClient(withInterceptors([adminAuthInterceptor]), withRequestsMadeViaParent()),
],
loadChildren: () => import('@features/admin/admin.routes').then(m => m.adminRoutes),
},
{
path: 'chat',
title: 'Chat Area',
providers: [
provideHttpClient(withInterceptors([userAuthInterceptor]), withRequestsMadeViaParent()),
],
loadChildren: () => import('@features/chat/chat.routes').then(m => m.chatRoutes),
},

// Default route redirects
// ...
];


And a sample interceptor:

export const adminAuthInterceptor: HttpInterceptorFn = (req, next) => {
console.log('adminAuthInterceptor: Request intercepted:', req);
return next(req); // Let the request pass through unchanged
};

Problem:


With this setup, no requests are intercepted by adminAuthInterceptor or userAuthInterceptor.

Question:


How can I correctly configure provideHttpClient to ensure that the appropriate interceptor is applied to requests based on the active route?

The interceptors should check if the authentication token is valid:

• adminAuthInterceptor for the admin routes.
• userAuthInterceptor for the chat routes.

Additional Context:

• My API services are generated using openapi-generator-cli.
• Components communicate with handwritten wrapper services that call the generated API services internally.
• I want all requests made under the admin route (lazy-loaded adminRoutes) to be intercepted by adminAuthInterceptor.
• Similarly, requests under the chat route (chatRoutes) should be intercepted by userAuthInterceptor.

Continue reading...