No component factory found for undefined. but did add to @NgModule.entryComponents with SharedModule

Question

So I've found dozens of articles explaining this problem and most suggestions say to add my component to the entryComponents array in @NgModule, but I am stumped as to where or which entryComponents in the many modules I have.. so basically my Module dependencies look like:

AppModule
 - EnvironmentModule
 - ContainerModule
 - SharedModule

EnvironmentModule
 - ContainerModule
 - EnvironmentListItemDetailComponent
    private _dialogRef: MatDialogRef<ConfirmDialogComponent>;

ContainerModule
 - MatDialogModule, 
 - ConfirmDialogComponent (this is the component that I want to move)
 - ContainerListItemDetailComponent
     private _dialogRef: MatDialogRef<ConfirmDialogComponent>;

Basically I want to move the ConfirmDialogComponent from the nested child Module to a shared Module that both the Environment and Container modules can take a dependency on. (I'd also love to move the ContainerModule out from under the EnvironmentModule, but that's for another day)

So I want to move ConfirmDialogComponent into a SharedModule and get everything hooked up, what do the @NgModule for App, Environment, Container, Shared look like? I am really confused.. so here's what I have so far:

shared.module.ts:

@NgModule({
  imports: [
    CommonModule,
    MatDialogModule,
    BrowserAnimationsModule
  ],
  declarations: [
    ConfirmDialogComponent
  ],
  exports: [
    ConfirmDialogComponent
  ],
  entryComponents: [
    ConfirmDialogComponent
  ]
})
export class SharedModule { }

environment.module.ts:

@NgModule({
  imports: [
    HttpClientModule,
    CommonModule,
    FormsModule,
    EnvironmentRoutingModule,
    ContainerModule
  ],
  declarations: [
    EnvironmentListComponent,
    EnvironmentListEnvironmentsComponent,
    EnvironmentListItemDetailComponent,
    EnvironmentListItemComponent
  ],
  providers: [... ]
})

container.module.ts:

@NgModule({
  imports: [
    FormsModule,
    CommonModule,
    BrowserAnimationsModule,
    MatDialogModule,
    ContainerRoutingModule
  ],
  declarations: [
    KeysPipe,
    ContainerListComponent,
    ContainerListItemComponent,
    ContainerListItemDetailComponent,
    ParameterListComponent,
    ParameterListItemComponent,
    ParameterTypeInfoComponent,
    ConfirmDialogComponent
  ],
  exports: [
    ContainerListComponent
  ],
  providers: [...],
  entryComponents: [ ConfirmDialogComponent ]
})

app.module.ts:

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    FormsModule,
    BrowserModule,
    AppRoutingModule,
    HttpModule,
    ContainerModule,
    EnvironmentModule,
    LoginModule,
    SharedModule,
    PageNotFoundModule /* DO NOT MOVE THIS - as a result of routing peculiarities the order of child routes matter for handling wildcard ** https://stackoverflow.com/questions/40015385/angular-2-router-wildcard-handling-with-child-routes */
  ],
  providers: [
    AppConfigService,
    AuthGuardService,
    BootstrapService,
    EventBrokerService,
    HttpClientService,
    TruIdTokenService,
    StartupService,
    {
      provide: APP_INITIALIZER,
      useFactory: initConfiguration,
      deps: [StartupService],
      multi: true
    }
  ],
  bootstrap: [AppComponent]
})

So I don't know :\ it's a bit of a mess and I am not even sure I have all my dependencies organized correctly.

Answer 1

1. Remove all entry entryComponents
2. Remove the declaration of ConfirmDialogComponent from all modules except SharedModule.
3. Import SharedModule into the modules wherever ConfirmDialogComponent was used.

Answer 2

So I guess I needed:

1. Remove all entry entryComponents
2. Remove the declaration of ConfirmDialogComponent from all modules except SharedModule.
3. Import SharedModule into the modules wherever ConfirmDialogComponent was used.
4. Add entryComponents: [ ConfirmDialogComponent ] to the SharedModule
5. Change import { ConfirmDialogComponent } in any child component to use the new location of the shared component