angular - 如何解决模态对话框延迟加载时的 EntryComponent 问题？

Question

我正在使用 Angular 8，我想在我的项目中延迟加载对话框。执行此操作时出现以下错误:-

No component factory found for EditProfileComponent. Did you add it to@NgModule.entryComponents?

因为这是延迟加载组件，所以我不想在 app.module.ts 中声明 EditProfileComponent。

详细代码如下:-

app-routing.module.ts

import { HomeComponent } from './Pages/HomePages/Home/home.component';
const routes: Routes = [
    { path: 'home',  component: HomeComponent
    children: [              
        { path: 'editprofile',loadChildren: () => import('./Pages/ProfilePages/EditProfile/editprofile.module').then(m => m.EditProfileModule)},                                      
    ]},  
  { path: '**', redirectTo: '/login' },
];

home.component.html

<mat-menu #welcome="matMenu">
     <button class="button-menu" mat-menu-item [routerLink]="editprofile" [queryParams]="{dialog: 
     true}">Edit Profile</button>
</mat-menu>

home.component.ts(编辑配置文件页面从这里正确打开)

import { EditProfileComponent } from '../../ProfilePages/EditProfile/editprofile.component'

constructor(private route: ActivatedRoute, private router: Router, private dialog: MatDialog) {        
    route.queryParams.subscribe(params => {
        if (params['dialog']) {
          this.openEditProfile();
        }
    });
}

public openEditProfile() {
    const editProfDialogRef = this.dialog.open(EditProfileComponent, {
        width: '50%',
        disableClose: true
    });    
}

editprofile-routing.module.ts

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { EditProfileComponent } from './editprofile.component';

const routes: Routes = [
  {  path: '',component:  EditProfileComponent },    
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class EditProfileRoutingModule { }

editprofile.module.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { EditProfileRoutingModule } from './editprofile-routing.module';
import { EditProfileComponent } from './editprofile.component';

@NgModule({
  imports: [
    CommonModule,      
    EditProfileRoutingModule,    
  ],
  declarations: [
    EditProfileComponent,          
  ],
  entryComponents: [    
    EditProfileComponent,      
  ],
})
export class EditProfileModule { }

如何解决问题？

Answer 1

如所述here通过 Fateh Mohamed :

...if ConfirmComponent is in another module, you need to export it there thus you can use it outside, add:

exports: [ ConfirmComponent ]

因此，只需将 EditProfileComponent 添加到 editprofile.module.ts 的导出数组中，就可以开始了!

快乐编码:)