Ionic HttpClient inject error - ionic-framework

Question

I'm new to Ionic and experiencing the following error when I inject HttpClient into my service class:
Error: Uncaught (in promise): Error: StaticInjectorError(AppModule)[CategoriesServiceProvider -> HttpClient]:
StaticInjectorError(Platform: core)[CategoriesServiceProvider -> HttpClient]:
NullInjectorError: No provider for HttpClient!
Error: StaticInjectorError(AppModule)[CategoriesServiceProvider -> HttpClient]:
StaticInjectorError(Platform: core)[CategoriesServiceProvider -> HttpClient]:
NullInjectorError: No provider for HttpClient!
The error is triggered by the following Service class:
import { HttpClient } from '#angular/common/http';
import { Injectable } from '#angular/core';
#Injectable()
export class CategoriesServiceProvider {
apiURL = 'https://randomuser.me/api/?results=10';
constructor(private http: HttpClient) {
console.log('Hello CategoriesServiceProvider Provider');
}
}
If I remove the HttpClient from the constructor, the error goes away.
And, the following is my app.module.ts code:
import { BrowserModule } from '#angular/platform-browser';
import { ErrorHandler, NgModule } from '#angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '#ionic-native/splash-screen';
import { StatusBar } from '#ionic-native/status-bar';
import { MyApp } from './app.component';
import { TabsPage } from '../pages/tabs/tabs';
import { CategoriesPage } from '../pages/categories/categories';
import { SubscriptionsPage } from '../pages/subscriptions/subscriptions';
import { CategoriesServiceProvider } from '../providers/categories-service/categories-service';
#NgModule({
declarations: [
MyApp,
TabsPage,
CategoriesPage,
SubscriptionsPage
],
imports: [
BrowserModule,
IonicModule.forRoot(MyApp)
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
TabsPage,
CategoriesPage,
SubscriptionsPage
],
providers: [
StatusBar,
SplashScreen,
{provide: ErrorHandler, useClass: IonicErrorHandler},
CategoriesServiceProvider
]
})
export class AppModule {}
Any insights will be appreciated.

Answer 1

Add import { HttpClientModule } from '#angular/common/http'; in your app module.
In imports, add HttpClientModule like:
imports: [
BrowserModule,
HttpClientModule,
IonicModule.forRoot(MyApp)
]