“在 Angular|Ionic 中找不到 [自定义组件] 的组件工厂”

Kod*_*ant 2 ionic-framework ionic2 ionic3 angular

我正在使用带有延迟加载页面的 Ionic 3。尝试在页面内的组件中显示模式时,出现以下错误:

No component factory found for CourseEditorComponent. Did you add it to @NgModule.entryComponents?
Run Code Online (Sandbox Code Playgroud)

正如你可以看到下面下来,我已经添加了CourseEditorComponent作为entryComponent到courses.modules.ts,其中得到由进口dashboard.modules.ts

我对 Angular/Ionic 中使用自定义 entryComponents 的方式有什么误解吗?

等级制度

DashboardPage
-CoursesComponent
--CourseEditorComponent
--CourseCreatorComponent
-InstructorsComponent
Run Code Online (Sandbox Code Playgroud)

模块

仪表板.module.ts

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { DashboardPage } from './dashboard';
import { CoursesModule } from "./courses/courses.module";

@NgModule({
  declarations: [
    DashboardPage
  ],
  imports: [
    IonicPageModule.forChild(DashboardPage),
    CoursesModule
  ],
})
export class DashboardPageModule {}
Run Code Online (Sandbox Code Playgroud)

course.module.ts

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { CoursesComponent } from './courses';
import { CourseEditorComponent } from "./course-editor/course-editor";

@NgModule({
  declarations: [CoursesComponent],
  imports: [IonicPageModule.forChild(DashboardPage)],
  entryComponents: [CourseEditorComponent],
  exports: [CoursesComponent,CourseEditorComponent]
})
export class CoursesModule {}
Run Code Online (Sandbox Code Playgroud)

课程组件

import { Component } from '@angular/core';
import { ModalController } from 'ionic-angular';
import { CourseEditorComponent } from "./course-editor/course-editor";

@Component({
  selector: 'courses',
  templateUrl: 'courses.html',
})
export class CoursesComponent {
  editCourse(data) {
    let editor = this.modal.create(CourseEditorComponent,{course: data});
    editor.present();
  }
}
Run Code Online (Sandbox Code Playgroud)

Rah*_*ngh 5

@NgModule({
  imports:      [ BrowserModule, FormsModule ],
  declarations: [ AppComponent, HelloComponent ],
  bootstrap:    [ AppComponent ],
  entryComponents: [your modal component] // you need to add it to entry component
})
export class AppModule { }
Run Code Online (Sandbox Code Playgroud)

截至目前,尚不支持相同的问题,在 Angular git repo LINK 中报告了相同的问题

使用 EntryComponentsModule

导入EntryComponentsModule(您定义所有 entryComponents 的位置),AppModule直到问题得到解决。

CourseEditorComponent作为页面使用

CourseEditorComponent成一个网页,并改变modal.create(CourseEditorComponent)modal.create('CourseEditorComponent')