Opening Nebular dialog from Nebular window component

Question

My structure is like this:

|_ app.module.ts
|_ app.component.ts
|_ admin
|   |_ admin.module.ts
|   |_ admin.component.ts
|   |_ admin.component.html
|   |_ org-tree
|      |_ org-tree.component.ts
|      |_ org-tree.component.html
|      |_ org-edit
|        |_ org-edit.component.ts
|        |_ org-edit.component.html
|        |_ org-delete-dialog
|          |_ org-delete-dialog.component.ts
|          |_ org-delete-dialog.component.html

org-tree displays a hierarchical list of organisations. Clicking on any of these opens the edit dialog via

this.windowService.open(OrgEditComponent, { title: `Edit`, context: { organisation: org } });

This window contains a form with a save and a delete button. The delete button is attached to the following:

this.dialogService.open(OrgDeleteDialogComponent, {
  context: {
    organisation: this.organisation
  },
  closeOnBackdropClick: false,
});

Clicking this button gives the following error:

ERROR Error: No component factory found for OrgDeleteDialogComponent. Did you add it to @NgModule.entryComponents?    OrgEditComponent.html:138
    at noComponentFactoryError (core.js:19453)
    at CodegenComponentFactoryResolver.resolveComponentFactory (core.js:19504)
    at NbPortalOutletDirective.attachComponentPortal (portal.js:506)
    at NbDialogContainerComponent.attachComponentPortal (index.js:17947)
    at NbDialogService.createContent (index.js:18156)
    at NbDialogService.open (index.js:18114)
    at OrganisationEditComponent.confirmDeleteOrg (organisations-edit.component.ts:43)
    at Object.eval [as handleEvent] (OrganisationEditComponent.html:141)
    at handleEvent (core.js:34777)
    at callWithDebugContext (core.js:36395)

AdminModule is:

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    NbCardModule,
    ThemeModule,
    NbTreeGridModule,
    NbButtonModule,
    NbInputModule,
    NbIconModule,
    NbWindowModule.forChild(),
    NbDialogModule.forChild(),
  ],
  declarations: [
    AdminComponent,
    OrgTreeComponent,
    OrgDeleteDialogComponent,
    OrgEditComponent,
    FsIconComponent,
  ],
  entryComponents: [
    OrgDeleteDialogComponent,
    OrgEditComponent,
  ]
})
export class AdminModule { }

If I put a button to open the org-delete-dialog on the org-tree-component, it opens fine, so I guess it's something to do with the Window component opening the Dialog component.

What do I need to add to make this work?

Thanks.

Answer 1

I changed the code so that clicking the button in either location simply dispatched an event, and that event was handled in the org-tree-component to open the actual dialog.