In the ASP.NET Core MVC with Angular template we've been using, the new HttpClient class is not enabled by default. In order to use that, we need to add its references to the Angular's AppModule class. We already know from Chapter 1, Getting Ready, that we have three files to properly configure it: app.module.browser.ts, app.module.server.ts, and app.module.shared.ts. Since we definitely want the QuizListComponent to be available for both client-side and server-side rendering, we will add it to the app.module.shared.ts file.

Go to the /ClientApp/app/ folder, open the app.module.shared.ts file, and replace the references to the former HTTP service with the new one in the following way (changed lines are highlighted):

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { HttpClientModule } from '@angular/common/http';
import { RouterModule } from '@angular/router';

import { AppComponent } from './components/app/app.component';
import { NavMenuComponent } from './components/navmenu/navmenu.component';
import { HomeComponent } from './components/home/home.component';
import { QuizListComponent } from './components/quiz/quiz-list.component';
import { QuizComponent } from './components/quiz/quiz.component';

@NgModule({
    declarations: [
        AppComponent,
        NavMenuComponent,
        HomeComponent,
        QuizListComponent,
        QuizComponent
    ],
    imports: [
        CommonModule,
        HttpClientModule,
        FormsModule,
        RouterModule.forRoot([
            { path: '', redirectTo: 'home', pathMatch: 'full' },
            { path: 'home', component: HomeComponent },
            { path: '**', redirectTo: 'home' }
        ])
    ]
})
export class AppModuleShared {
}