@angular/core#ModuleWithProviders TypeScript Examples

export function createTranslateModule(): ModuleWithProviders<TranslateModule> {
  return TranslateModule.forRoot({
    loader: {
      provide: TranslateLoader,
      useFactory: testHttpLoaderFactory,
      deps: [HttpClient],
    },
    compiler: {
      provide: TranslateCompiler,
      useClass: TranslateMessageFormatCompiler,
    },
  });
}

/**
   * Define the icons that will be included in the application. This allows unused icons to
   * be tree-shaken away to reduce bundle size
   * @param icons The object containing the required icons
   */
  static withIcons(
    icons: Record<string, string>,
  ): ModuleWithProviders<NgIconsModule> {
    IconService.addIcons(icons);

    return { ngModule: NgIconsModule };
  }

static forRoot(customParams: ApiConfigurationInterface): ModuleWithProviders<ApiModule> {
    return {
      ngModule: ApiModule,
      providers: [
        {
          provide: ApiConfiguration,
          useValue: {rootUrl: customParams.rootUrl}
        }
      ]
    }
  }

public static forRoot(): ModuleWithProviders<TourConsoleModule> {
    return {
      ngModule: TourConsoleModule,
      providers: [
        TourService,
        TourBackdropService
      ],
    };
  }

static forRoot(): ModuleWithProviders<MobileModule> {
    return {
      ngModule: MobileModule,
      providers: [
        QrScannerService,
        QRScanner,
        DeviceAuthService,
        AndroidFingerprintAuth,
        {
          provide: 'TouchID',
          useValue: TouchID,
        },
        {
          provide: 'Keychain',
          useValue: Keychain,
        },
      ],
    };
  }

public static forRoot(): ModuleWithProviders<TourNgxBootstrapModule> {
    return {
      ngModule: TourNgxBootstrapModule,
      providers: [
        TourStepTemplateService,
        TourService,
        NgxbTourService,
        TourBackdropService
      ]
    };
  }

static forRoot(
    config?: InoElementsConfig
  ): ModuleWithProviders<InoElementsModule> {
    return {
      ngModule: InoElementsModule,
      providers: [
        {
          provide: ConfigToken,
          useValue: config,
        },
        {
          provide: APP_INITIALIZER,
          useFactory: appInitialize,
          multi: true,
          deps: [ConfigToken, DOCUMENT, NgZone],
        },
      ],
    };
  }

static forRoot(): ModuleWithProviders<ThemeModule> {
    return {
      ngModule: ThemeModule,
      providers: [
        ...NbThemeModule.forRoot(
          {
            name: ThemeSwitcherComponent.getThemeName(),
          },
          [DEFAULT_THEME, DARK_THEME]
        ).providers,
      ],
    };
  }

static forRoot(
    productionBuild: boolean
  ): ModuleWithProviders<DashboardModule> {
    return {
      ngModule: DashboardModule,
      providers: [
        {
          provide: AVAILABLE_APPS,
          useFactory: () => {
            return AvailableApps(productionBuild).reduce(
              (acc, appRegistration) => ({
                ...acc,
                [appRegistration.name]: appRegistration,
              }),
              {}
            );
          },
        },
      ],
    };
  }

static forFeature(): ModuleWithProviders<DynFormsBootstrapModule> {
    return {
      ngModule: DynFormsBootstrapModule,
      providers: getModuleProviders({
        controls: [
          {
            control: DynBsCheckboxComponent.dynControl,
            instance: DynBsCheckboxComponent.dynInstance,
            component: DynBsCheckboxComponent,
          },
          {
            control: DynBsInputComponent.dynControl,
            instance: DynBsInputComponent.dynInstance,
            component: DynBsInputComponent,
          },
          {
            control: DynBsRadioComponent.dynControl,
            instance: DynBsRadioComponent.dynInstance,
            component: DynBsRadioComponent,
          },
          {
            control: DynBsSelectComponent.dynControl,
            instance: DynBsSelectComponent.dynInstance,
            component: DynBsSelectComponent,
          },
        ],
      }),
    };
  }

public static forRoot(): ModuleWithProviders<TourNgBootstrapModule> {
    return {
      ngModule: TourNgBootstrapModule,
      providers: [
        TourStepTemplateService,
        TourService,
        NgbTourService,
        TourBackdropService
      ],
    };
  }

static forRoot(): ModuleWithProviders<ThemeModule> {
    return {
      ngModule: ThemeModule,
      providers: [
        ...NbThemeModule.forRoot(
          {
            name: 'default',
          },
          [ DEFAULT_THEME, COSMIC_THEME, CORPORATE_THEME, DARK_THEME, MATERIAL_LIGHT_THEME, MATERIAL_DARK_THEME ],
        ).providers,
      ],
    };
  }

static forRoot(): ModuleWithProviders<ErrorReportModule> {
    return {
      ngModule: ErrorReportModule,
      providers: [
        {
          provide: ErrorHandler,
          useValue: Sentry.createErrorHandler(),
        },
        {
          provide: Sentry.TraceService,
          deps: [Router],
        },
        {
          provide: APP_INITIALIZER,
          // eslint-disable-next-line @typescript-eslint/no-empty-function
          useFactory: () => () => {},
          deps: [Sentry.TraceService],
          multi: true,
        },
      ],
    };
  }

static forRoot(config?: any): ModuleWithProviders<NgxsInterceptorPluginModule> {
    return {
      ngModule: NgxsInterceptorPluginModule,
      providers: [
        {
          provide: NGXS_PLUGINS,
          useClass: NgxsInterceptorPlugin,
          multi: true
        },
        {
          provide: NGXS_INTERCEPTOR_PLUGIN_OPTIONS,
          useValue: config
        }
      ]
    };
  }

public static forRoot(allFacets: any[]|undefined = undefined, defaultFacets: FacetState[]|undefined = undefined): ModuleWithProviders<BsFacetModule> {
        return {
            ngModule: BsFacetModule,
            providers: [
                {
                    provide: ALL_FACETS,
                    useValue: allFacets
                },
                {
                    provide: DEFAULT_FACETS,
                    useValue: defaultFacets
                },
            ]
        };
    }

static forRoot(): ModuleWithProviders {
    return {
      ngModule: UtilityModule,

      providers: []
    };
  }

public static forRoot(twirpOptions: TwirpOptions): ModuleWithProviders<TwirpModule> {
    return {
      ngModule: TwirpModule,
      providers: [
        {provide: TWIRP_TRANSPORT_OPTIONS, useValue: twirpOptions},
        {provide: RPC_TRANSPORT, useExisting: TwirpTransport}
      ]
    };
  }

static setLocale(locale: string): ModuleWithProviders<NgxMatTimepickerModule> {
        return {
            ngModule: NgxMatTimepickerModule,
            providers: [
                {provide: NGX_MAT_TIMEPICKER_LOCALE, useValue: locale},
                {provide: NGX_MAT_TIMEPICKER_CONFIG, useValue: undefined},
            ]
        };
    }

static forRoot(url: string, options: SocketIOOptions = {}): ModuleWithProviders<SocketIOModule> {
        return {
            ngModule: SocketIOModule,
            providers: [
                {
                    provide: SocketIO,
                    useFactory: socketIOFactory,
                    deps: [SOCKETIO_URL, SOCKETIO_OPTIONS]
                },
                { provide: SOCKETIO_URL, useValue: url },
                { provide: SOCKETIO_OPTIONS, useValue: options },
            ]
        };
    }

static forRoot(): ModuleWithProviders<CoreModule> {
    return {
      ngModule: CoreModule,
      providers: [
        ...NB_CORE_PROVIDERS,
        UserStore,
        UsersService,
        InitUserService,
        SettingsService,
      ],
    };
  }

static forRoot(options: Partial<IAuthStoreOptions> = {}): ModuleWithProviders<AuthStoreModule> {
    return {
      ngModule: AuthStoreModule,
      providers: [
        {
          provide: HTTP_INTERCEPTORS,
          useClass: AuthInterceptor,
          multi: true
        },
        {
          provide: IAuthFacade,
          useClass: options.facade || BaseAuthFacade
        },
        {
          provide: IAuthStorage,
          useClass: options.storage || BaseAuthStorage
        },
        {
          provide: IAuthApollo,
          useClass: options.apollo || BaseAuthApollo
        }
      ]
    }
  }

public static forRoot(dynamicBrowserTitleConfig: DynamicBrowserTitleConfig): ModuleWithProviders<DynamicBrowserTitleModule> {
    return {
      ngModule: DynamicBrowserTitleModule,
      providers: [
        {
          provide: DynamicBrowserTitleConfig,
          useValue: dynamicBrowserTitleConfig
        },
      ]
    };
  }

// Make sure to set the optional function signature "ModuleWithProviders<T>".
  // Note: This will break Angular 5 backwards compatibility, but enable compatibility with newer versions (13+?).
  static forRoot(globalSettings: DynamicHooksGlobalSettings, platformService?: Type<PlatformService>): ModuleWithProviders<DynamicHooksModule> {
    return {
      ngModule: DynamicHooksModule,
      providers: [
        // Put app-wide services here
        { provide: DYNAMICHOOKS_GLOBALSETTINGS, useValue: globalSettings },
        OutletService,
        DataTypeEncoder,
        DataTypeParser,
        DeepComparer,
        HookFinder,
        { provide: PlatformService, useClass: platformService || PlatformBrowserService }
      ]
    };
  }

static forRoot(): ModuleWithProviders<AuthModule> {
    return {
      ngModule: AuthModule,
      providers: [
        { provide: NB_AUTH_TOKEN_INTERCEPTOR_FILTER, useValue: filterInterceptorRequest },
        { provide: HTTP_INTERCEPTORS, useClass: NbAuthJWTInterceptor, multi: true },
        { provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true },
        ...GUARDS],
    };
  }

static forRoot(
    toggles: LgToggles,
    optionsInjectable?: LgFeatureToggleOptions,
  ): ModuleWithProviders<LgFeatureToggleModule> {
    return {
      ngModule: LgFeatureToggleModule,
      providers: [
        LgFeatureToggleService,
        {
          provide: togglesInjectable,
          useFactory: toggles.useFactory,
          deps: toggles.deps,
        },
        {
          provide: togglesOptionsInjectable,
          useValue: optionsInjectable,
        },
      ],
    };
  }

static initialize(firebaseConfig: FirebaseOptions): ModuleWithProviders {
    return {
      ngModule: FireAdminModule,
      providers: [
        FireAdminService,
        {
          provide: FirebaseOptionsToken,
          useValue: firebaseConfig
        }
      ]
    };
  }

static forRoot(): ModuleWithProviders<EcommerceMockModule> {
    return {
      ngModule: EcommerceMockModule,
      providers: [
        ...INTERNAL_SERVICES,
        ...SERVICES,
      ],
    };
  }

static forRoot(): ModuleWithProviders<CoreModule> {
    return {
      ngModule: CoreModule,
      providers: [
        ErrorInterceptorProvider,
        AuthInterceptorProvider,
        // { provide: ErrorHandler, useClass: MyErrorHandler }
      ]
    };
  }

static forRoot(): ModuleWithProviders<ThemeModule> {
    return {
      ngModule: ThemeModule,
      providers: [
        ...NbThemeModule.forRoot(
          {
            name: 'default',
          },
          [ DEFAULT_THEME, COSMIC_THEME, CORPORATE_THEME, DARK_THEME ],
        ).providers,
        InitUserService,
      ],
    };
  }