无法将组件加载到页面中 - 角度 4/离子 3

Question

页面上显示一个按钮。但是，当用户选择该按钮时，将显示子组件，则会出现以下错误 - 错误：未捕获(承诺(：错误：找不到 ModalComponent 的组件工厂。您是否将其添加到 @NgModule.entryComponents？

我设置的结构如下，这是与 Ionic 3 结合使用的 -

app (folder) 
 - app.module
 - app.component
components (folder)
 - modal-component.ts
pages (folder)
 - pageOne (folder)
   - pageOne.module
   - pageOne.ts

我把模态组件放在页面一模块中

页面一.模块

@NgModule({
    declarations: [
        pageOne,
        modalComponent
    ],
    entryComponents: [
        modalComponent
    ],
    imports: [
        IonicPageModule.forChild(pageOne),
    ],
    exports: [
        pageOne,
    ]
})
export class pageOneModule {}

页面一.ts

@IonicPage()
@Component({
  selector: 'pageOne',
  templateUrl: 'pageOne.html',
})
export class pageOne {}

Answer 1

你是在引导你的模块吗？

把它放在它将加载的地方

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { pageOneModule } from './pages/pageOne/pageOne.module';
document.addEventListener('DOMContentLoaded', () => {
  platformBrowserDynamic().bootstrapModule(pageOneModule)
  .catch(err => console.log(err));
});

我还建议使用角度cli，它为您做这种事情。

Answer 2

您的页面模块设置不适合延迟加载。我不确定究竟是什么导致了确切的错误，但是当您延迟加载时，您不会导出或声明条目组件。将页面模块更改为：

@NgModule({
    declarations: [
        pageOne,
        modalComponent ],
    imports: [ IonicPageModule.forChild(pageOne) ]
})
export class pageOneModule {}

现在，您没有发布模态组件代码，所以我不确定它是否是您制作的东西。如果它像 Material2 模态这样的东西，它们需要在 entryComponents 中。此外，您的 Nav 堆栈现在应该使用页面的字符串名称，而不是导入，以确保您加载相同的对象而不是克隆它。