使用模态组件时，懒惰加载错误

Question

您好，我尝试使用模态组件使用懒惰加载，因此我有一个共享组件模块：

@NgModule({
  declarations: [
    AddNoteComponent,
    EditNoteComponent
  ],
  imports: [
    IonicModule,
  ],
  exports: [
    AddNoteComponent,
    EditNoteComponent
  ]
})
export class ComponentsModule {}

我想在notes.ts页面中使用它们，所以我将componentsModule类导入了notes.module.ts，例如：

@NgModule({
  declarations: [
    NotesPage,
  ],
  imports: [
    IonicPageModule.forChild(NotesPage),
    ComponentsModule,
  ],
})
export class NotesPageModule {}

所以在我的注释中。

addNoteModal() {
  let noteModal = this.modalCtrl.create('AddNoteComponent', {
    'mid': this.module.key
  });
  noteModal.present();
}

当我使用懒惰加载时，这应该可以正常工作，

但是Ionic告诉我：

错误错误：未被发达（在承诺中）：无效链接：addNoteComponent

这是我的环境：
离子框架：3.9.2
离子应用脚本：3.1.2
角芯：5.0.1
角编译器CLI：5.0.1
节点：8.4.0
操作系统平台：Windows 10
导航器平台：Win32
用户代理：Mozilla/5.0（Linux; Android 6.0; Nexus 5 Build/MRA58N）AppleWebkit/537.36（Khtml，像Gecko一样）Chrome/62.0.3202.94 Mobile Safari/Mobile Safari/537.36

您需要将页面

用作模态，而不是常规组件。因此，如果要使用AddNoteComponent的内容创建模态，则需要创建一个新页面（包括@IonicPage() Decorator，以便可以懒惰）导入该组件，然后使用该页面作为模态。

所以这将是页面：

// Angular
import { Component } from '@angular/core';
// Ionic
import { IonicPage } from 'ionic-angular';
@IonicPage()
@Component({
    selector: 'page-add-note',
    templateUrl: 'add-note.html'
})
export class AddNotePage {
    constructor() { }
    // ...
}

这将是页面的模块：

@NgModule({
  declarations: [
    AddNotePage,
  ],
  imports: [
    IonicPageModule.forChild(AddNotePage),
    ComponentsModule,
    // ...
  ],
})
export class AddNotePageModule {}

这就是您将使用该页面的方式：

addNoteModal() {
  let noteModal = this.modalCtrl.create('AddNotePage', {
    'mid': this.module.key
  });
  noteModal.present();
}