No provider for BsModalService
ngx-Bootstrap
library provides angular based directives & components for Bootstrap JS components. In a tricky situation, where Angular UI bootstrap team has skipped their development plan directly from AngularJs 1.6 + Bootstrap 3 to Angular + Bootstrap 4...
ngx-Bootstrap has become a solid solution for most people bridging widely used Bootstrap version 3 with Angular 2+.
The entire library is written using ES6(ES2015)
modules in Typescript. It offers each bootstrap component as separate modules, so that you can use include entire ngx-bootstrap
npm package in your project, but just import the required modules and leave the rest off (like a custom build for your project).
The expected way in-order to register all the services or providers specific to a particular module, should use construct - module.forRoot()
.
@NgModule({
imports: [AccordionModule.forRoot(),...]
})?
The recommended way of ES6 modules import, is to just import the module that you require; for e.g., accordion module would need following specific import
import { AccordionModule } from 'ngx-bootstrap/accordion';
But this will result in the services not getting registered. This import will lead to error message - 'No provider for BsModalServices
'. So in-order to make the dependent services to be imported properly; Use
import { AccordionModule } from 'ngx-bootstrap';
Above construct in ES6 would mean, that it should import entire library into our bundle and it does pull complete library. But with a proper AoT setup, after tree shaking the final bundle will contain just the required module as expected.