ng-bootstrap: Modal Component guide and example throw exceptions

in the lazy module. we need reimport the NgbModule,just like root module.

@NgModule({
    imports: [
        CommonModule,
        FormsModule,
        NgbModule.forRoot(),
        routing
    ],
    providers: [I18nService],
    declarations: [I18nComponent,
        ListComponent, StartComponent, ProjectComponent, ModuleComponent,
        CustomModalContent],
    entryComponents:[CustomModalContent]
})
export class I18nModule {
}

then it is working but i don`t known why!!!

in the lazy module. we need reimport the NgbModule,just like root module.

@Syes-K this shouldn’t be needed and in child components you should just add NgbModule instead of NgbModule.forRoot(). If this doesn’t work could you please open a separate issue for lazy-loaded modules? Just please add a minimal reproduce scenario in a plunker, see: https://github.com/ng-bootstrap/ng-bootstrap#you-think-youve-found-a-bug)

Yeah, needs to be on the app module. Haven’t quite figured out why.

did the entryComponents must be added to the root module? i add it to the lazy loaded module , but it`s not working

It needs to be added to entryComponents as well. Here’s a working plnkr:

http://plnkr.co/edit/3ldNkfXPjZCI7g2QK0xK?p=preview

On second thought, I did figure it out. The modal needs to be declared and added to the entryComponents of the module:

import { NgbdModalComponent, NgbdModalContent } from './modal-component';

...

@NgModule({
  imports: [BrowserModule, FormsModule, ReactiveFormsModule, JsonpModule, NgbModule.forRoot()], 
  declarations: [App, NgbdModalComponent, NgbdModalContent],
  entryComponents: [NgbdModalContent],
  bootstrap: [App]
}) 

starts working again.