Skip to content

Can not close NbDialog window on click outside of the modal window #2666

Open
@antoshens

Description

@antoshens

Issue type

I'm submitting a ...

  • bug report
  • feature request

Issue description

Current behavior:

I have a modal window and using NbDialog for this purpose.
And I noticed that if I have redirect to the several nested pages i,e /pages/page1/subPage2,
and open a modal window that can be opened globaly from the any page (it is in header of the site)., then
I can not close it on clicking outside of the window. I have to click 2 or 3 times in a row.

Expected behavior:

The window should be closed immediately after clickin outside the modal window.

Steps to reproduce:

Related code:

I use dialogService as in the example below:

this._dialogService.open(AboutComponent, {
          context: {},
          autoFocus: false,
        });

In module.ts I have the following code:

const NB_MODULES = [
  NbLayoutModule,
  NbMenuModule,
  NbUserModule,
  NbActionsModule,
  NbSearchModule,
  NbSidebarModule,
  NbContextMenuModule,
  NbSecurityModule,
  NbButtonModule,
  NbSelectModule,
  NbIconModule,
  NbCardModule,
  NbDialogModule.forRoot(),
  NbPopoverModule,
  NbInputModule,
  NbCheckboxModule,
  NbTooltipModule,
  NbEvaIconsModule,
];

@NgModule({
  imports: [SharedModule, CommonModule, ReactiveFormsModule, ...NB_MODULES],
  exports: [CommonModule, ...PIPES, ...COMPONENTS],
  declarations: [...COMPONENTS, ...PIPES, AboutComponent],
  entryComponents: [AboutComponent]
})
export class ThemeModule {
  static forRoot(): ModuleWithProviders<ThemeModule> {
    return {
      ngModule: ThemeModule,
      providers: [
        ...NbThemeModule.forRoot(
          {
            name: 'default',
          },
          [DEFAULT_THEME, COSMIC_THEME, CORPORATE_THEME, DARK_THEME],
        ).providers,
      ],
    };
  }
}

Other information:

npm, node, OS, Browser

<!--
Node: 12.11.1,
OS: Windows (10).
Browser: Chrome?
-->

Angular, Nebular

<!--
Check your `package-lock.json` or locate a `package.json` in the `node_modules` folder.
-->
Angular: 9.1.12
Nebular: 5.1.0

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions