nullinjectorerror no provider for httpclient angular 17

In Angular 17 where the standalone true option is set by default, the app.config.ts file is generated in src/app/ and provideHttpClient(). We can be added to the list of providers in app.config.ts

Step 1: 

To provide HttpClient in a standalone app we could do this in the app.config.ts file,

app.config.ts:

import { ApplicationConfig } from '@angular/core';

import { provideRouter } from '@angular/router';

import { routes } from './app.routes';

import { provideClientHydration } from '@angular/platform-browser';

//This (provideHttpClient) will help us to resolve the issue 

import {provideHttpClient} from '@angular/common/http';

export const appConfig: ApplicationConfig = {

  providers: [

provideRouter(routes), 

provideClientHydration(),

provideHttpClient()

     ]

};

The appConfig const is used in the main.ts file, see the code,

main.ts :

import { bootstrapApplication } from '@angular/platform-browser';

import { appConfig } from './app/app.config';

import { AppComponent } from './app/app.component';

bootstrapApplication(AppComponent, appConfig)

  .catch((err) => console.error(err));