angular - Circular dependency in DI detected for ApplicationRef. How to fix it

Question

I am a beginner in Angular and tried to implement global error handling in the application for this purpose I create appErrorHandler class and implement ErrorHandler and I inject Toast Service on this class but it shows me above error. AppErrorHandler class.

  @Injectable()
 export class AppErrorHandler implements ErrorHandler {

constructor(private toastService: ToastrService) {}

handleError(error: any): void {
    this.toastService.error("An unexpected error","Error");
}    

}

AppModule

 providers: [
{ provide: ErrorHandler, useClass: AppErrorHandler },
MakeService
],
 imports: [
BrowserAnimationsModule,
  ToastrModule.forRoot(
  {
    timeOut: 6000,
   positionClass: 'toast-bottom-right',
   preventDuplicates: true,
  }
),
RouterModule.forRoot([
  
  {  path:'', component:HomeComponent },
  {  path:'vehicle-form', component:VehicleFormComponent },
  
]),

],

question from:https://stackoverflow.com/questions/65645124/circular-dependency-in-di-detected-for-applicationref-how-to-fix-it

Answer 1

Waitting for answers