akveo / nebular

:boom: Customizable Angular UI Library based on Eva Design System :new_moon_with_face::sparkles:Dark Mode
https://akveo.github.io/nebular
MIT License
8.05k stars 1.51k forks source link

NbPopover can not work #2277

Open quynb93 opened 4 years ago

quynb93 commented 4 years ago

I got a error when user NbPopover,

Please help me to resolve this

core.js:4002 ERROR TypeError: Cannot read property 'appendChild' of undefined at NbOverlayContainerAdapter.push../node_modules/@nebular/theme/fesm5/index.js.NbOverlayContainerAdapter._createContainer (index.js:1179) at NbOverlayContainerAdapter.push../node_modules/@angular/cdk/esm5/overlay.es5.js.OverlayContainer.getContainerElement (overlay.es5.js:898) at NbOverlay.push../node_modules/@angular/cdk/esm5/overlay.es5.js.Overlay._createHostElement (overlay.es5.js:4318) at NbOverlay.push../node_modules/@angular/cdk/esm5/overlay.es5.js.Overlay.create (overlay.es5.js:4246) at NbOverlayService.push../node_modules/@nebular/theme/fesm5/index.js.NbOverlayService.create (index.js:1895) at NbDynamicOverlay.push../node_modules/@nebular/theme/fesm5/index.js.NbDynamicOverlay.createOverlay (index.js:12266) at NbDynamicOverlay.push../node_modules/@nebular/theme/fesm5/index.js.NbDynamicOverlay.show (index.js:12229) at SafeSubscriber._next (index.js:12482) at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.__tryOrUnsub (Subscriber.js:192) at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.next (Subscriber.js:130)

pham93 commented 4 years ago

This only works when I wrap it in an nb-layout.

pham93 commented 4 years ago
@NgModule({
    imports: [
        NbMenuModule.forRoot(),
    ],
    exports: [
        NbButtonModule,
        NbCardModule,
        NbSidebarModule,
        NbMenuModule,
        NbSelectModule,
        NbEvaIconsModule,
        NbIconModule,
        NbActionsModule,
        NbContextMenuModule,
        NbMenuModule,
        NbUserModule,
        NbPopoverModule,
        NbLayoutModule
    ],
})
export class NebularModule { }
<nb-layout>
    <nb-layout-header fixed>
    </nb-layout-header>
    <nb-layout-column>
        <router-outlet></router-outlet>
    </nb-layout-column>
</nb-layout

It works after I removed NbThemeModule.forRoot() from imports

tegola commented 3 years ago

I have managed to solve this. See here.