Error: No provider for NgbDropdown! with v1.0.0-beta.5

No provider for NgbDropdown for v1.0.0-beta.5

I’m using ng-bootstrap inside my project for modals and other components alongside with bootstrap 4 ( only for styling ).

When I run ‘ng start’ I get the following error:

ERROR Error: Uncaught (in promise): Error: No provider for NgbDropdown!
Error: No provider for NgbDropdown!
    at injectionError (core.es5.js:1169)
    at noProviderError (core.es5.js:1207)
    at ReflectiveInjector_.webpackJsonp.../../../core/@angular/core.es5.js.ReflectiveInjector_._throwOrNull (core.es5.js:2649)
    at ReflectiveInjector_.webpackJsonp.../../../core/@angular/core.es5.js.ReflectiveInjector_._getByKeyDefault (core.es5.js:2688)
    at ReflectiveInjector_.webpackJsonp.../../../core/@angular/core.es5.js.ReflectiveInjector_._getByKey (core.es5.js:2620)
    at ReflectiveInjector_.webpackJsonp.../../../core/@angular/core.es5.js.ReflectiveInjector_.get (core.es5.js:2489)
    at resolveNgModuleDep (core.es5.js:9489)
    at NgModuleRef_.webpackJsonp.../../../core/@angular/core.es5.js.NgModuleRef_.get (core.es5.js:10577)
    at resolveDep (core.es5.js:11080)
    at createClass (core.es5.js:10939)
    at injectionError (core.es5.js:1169)
    at noProviderError (core.es5.js:1207)
    at ReflectiveInjector_.webpackJsonp.../../../core/@angular/core.es5.js.ReflectiveInjector_._throwOrNull (core.es5.js:2649)
    at ReflectiveInjector_.webpackJsonp.../../../core/@angular/core.es5.js.ReflectiveInjector_._getByKeyDefault (core.es5.js:2688)
    at ReflectiveInjector_.webpackJsonp.../../../core/@angular/core.es5.js.ReflectiveInjector_._getByKey (core.es5.js:2620)
    at ReflectiveInjector_.webpackJsonp.../../../core/@angular/core.es5.js.ReflectiveInjector_.get (core.es5.js:2489)
    at resolveNgModuleDep (core.es5.js:9489)
    at NgModuleRef_.webpackJsonp.../../../core/@angular/core.es5.js.NgModuleRef_.get (core.es5.js:10577)
    at resolveDep (core.es5.js:11080)
    at createClass (core.es5.js:10939)
    at resolvePromise (zone.js:795)
    at resolvePromise (zone.js:766)
    at zone.js:844
    at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:425)
    at Object.onInvokeTask (core.es5.js:3881)
    at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:424)
    at Zone.webpackJsonp.../../../../zone.js/dist/zone.js.Zone.runTask (zone.js:192)
    at drainMicroTaskQueue (zone.js:602)
    at <anonymous>

Version of project dependencies

Angular: 4.4.3
ng-bootstrap: 1.0.0-beta.5
Bootstrap: 4.0.0-beta

Runtime Environment:

OS: linux
node: 8.5

Main module configuration:

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    ...
    NgbModule.forRoot()
  ],
  providers: [...],
  bootstrap: [AppComponent]
})
export class AppModule { }

To be able to use it I’ve added NgbDropdown to the list of the providers.

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    ...
    NgbModule.forRoot()
  ],
  providers: [NgbDropdown],
  bootstrap: [AppComponent]
})

Question:

Is this expected?
Is it ok to set the component as an element of providers array?

Thank you