coreui / coreui-angular

CoreUI Components Library for Angular https://coreui.io/angular/docs/
https://coreui.io/angular/
MIT License
244 stars 145 forks source link

ERROR NullInjectorError: NullInjectorError: No provider for _SidebarNavHelper! #205

Open ehsan69h opened 1 month ago

ehsan69h commented 1 month ago

I moved this template to a modular project but I get the following error. Can you help me fix the problem?

main.ts:5 ERROR NullInjectorError: NullInjectorError: No provider for _SidebarNavHelper! at NullInjector.get (core.mjs:1659:27) at R3Injector.get (core.mjs:3105:33) at R3Injector.get (core.mjs:3105:33) at R3Injector.get (core.mjs:3105:33) at ChainedInjector.get (core.mjs:5447:36) at lookupTokenUsingModuleInjector (core.mjs:5800:39) at getOrCreateInjectable (core.mjs:5848:12) at ɵɵdirectiveInject (core.mjs:11394:19) at NodeInjectorFactory.SidebarNavComponent_Factory [as factory] (coreui-angular.mjs:14602:91) at getNodeInjectable (core.mjs:6060:44)

xidedix commented 1 month ago

@ehsan69h If you migrated your project to standalone you could try to importProvidersFrom(SidebarModule) in your ApplicationConfig

saravanans55 commented 1 month ago

To resolve this error, ensure you include SidebarNavHelperin the providers and also add BrowserAnimationsModule to the imports.

import { Guard } from './services/auth.service';
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { PublicComponent } from './layout/public/public.component';
import { LoginComponent } from './views/pages/login/login.component';
import { SecureComponent } from './layout/secure/secure.component';
import {
  AvatarComponent,
  BadgeComponent,
  BreadcrumbRouterComponent,
  ButtonDirective,
  ButtonGroupComponent,
  CardBodyComponent,
  CardComponent,
  CardFooterComponent,
  CardGroupComponent,
  CardHeaderComponent,
  ColComponent,
  ContainerComponent,
  DropdownComponent,
  DropdownDividerDirective,
  DropdownHeaderDirective,
  DropdownItemDirective,
  DropdownMenuDirective,
  DropdownToggleDirective,
  FormCheckLabelDirective,
  FormControlDirective,
  FormDirective,
  GutterDirective,
  HeaderNavComponent,
  HeaderTogglerDirective,
  InputGroupComponent,
  InputGroupTextDirective,
  NavItemComponent,
  NavLinkDirective,
  ProgressBarDirective,
  ProgressComponent,
  RowComponent,
  ShadowOnScrollDirective,
  SidebarBrandComponent,
  SidebarComponent,
  SidebarFooterComponent,
  SidebarHeaderComponent,
  SidebarNavComponent,
  SidebarNavHelper,
  SidebarToggleDirective,
  SidebarTogglerDirective,
  TableDirective,
  TemplateIdDirective,
  TextColorDirective,
  ThemeDirective,
  WidgetStatAComponent,
} from '@coreui/angular';
import { IconDirective } from '@coreui/icons-angular';
import { NgStyle, NgTemplateOutlet } from '@angular/common';
import { RegisterComponent } from './views/pages/register/register.component';
import { ChartjsComponent } from '@coreui/angular-chartjs';
import { ReactiveFormsModule } from '@angular/forms';
import { WidgetsBrandComponent } from './views/widgets/widgets-brand/widgets-brand.component';
import { DashboardComponent } from './views/dashboard/dashboard.component';
import { WidgetsDropdownComponent } from './views/widgets/widgets-dropdown/widgets-dropdown.component';
import { RouterLink, RouterLinkActive, RouterOutlet } from '@angular/router';
import { NgScrollbar } from 'ngx-scrollbar';
import {
  DefaultFooterComponent,
  DefaultHeaderComponent,
} from './layout/default-layout';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; // Import this line

@NgModule({
  declarations: [
    AppComponent,
    PublicComponent,
    LoginComponent,
    DashboardComponent,
    SecureComponent,
    RegisterComponent,
    WidgetsDropdownComponent,
    DefaultHeaderComponent,
    DefaultFooterComponent,
  ],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
   // All relevant coreui modules
    DropdownHeaderDirective,
    BadgeComponent,
    NgStyle,
  ],
  providers: [Guard,SidebarNavHelper],
  bootstrap: [AppComponent],
})
export class AppModule {}