Ionic 3 Lazy Loading - 无组件工厂

Question

对于离子-3项目,我们使用LAZY LOADING.我们的模块"LOGIN"正在延迟加载.一切正常,但是当我们尝试使用NAV CONTROLLER在LAZILY LOADED模块中的页面之间导航时 - 我们得到RUNTIME ERROR"NO COMPONENT FACTORY"

代码如下

login.ts

import { Component } from '@angular/core';
import { IonicPage } from 'ionic-angular';
import { NavController } from 'ionic-angular';
import {DummyPage} from './dummy';

@IonicPage()
@Component({
  templateUrl: 'login.html'
})
export class LoginPage {

  

  constructor(public navCtrl: NavController) 
  {

  }

  buttonClick()
  {
      this.navCtrl.push(DummyPage)
  }

}

login.module.ts

import {ModuleWithProviders, NgModule, Optional, SkipSelf }       from '@angular/core';
import { CommonModule }      from '@angular/common';
import { IonicPageModule } from 'ionic-angular';
import {LoginPage} from './login';
import {DummyPage} from './dummy';

@NgModule({
  imports:      [ CommonModule, IonicPageModule.forChild(LoginPage) ],
  declarations: [LoginPage, DummyPage],
  exports:      [ LoginPage, DummyPage ],
  providers:    [  ]
})

/* core module is imported once and is made
applicable through the app. Application wide singleton services
like user authentication etc. are defined here */

export class LoginModule {
}

DUMMY.TS是INSIN模块中的页面,我不想为它创建单独的NG MODULe - 因此使用navController.这怎么会抛出一个错误

import { Component } from '@angular/core';
import { IonicPage } from 'ionic-angular';
import { NavController } from 'ionic-angular';


@Component({
  template:'<h1> AWWWW </h1>'
})
export class DummyPage {

  

  constructor(public navCtrl: NavController) 
  {

  }

  buttonClick()
  {
    alert("Hello world");
  }

}

如上所示,我在ngModule和entryComponents中添加了DUMMY.TS

错误是:

Answer 1

解决方案是在app.module.ts中添加对此页面的引用，并将其添加到引用中

    import {DummyPage} from './login/dummy';
@NgModule({
  declarations: [MyApp, DummyPage],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [MyApp, DummyPage],
  providers: [
    StatusBar,
    SplashScreen,
    { provide: ErrorHandler, useClass: IonicErrorHandler }]
})
export class AppModule { }

猜测 Ionic 将 DummyPage 视为动态加载的页面，我们需要告诉 app.module.ts 离线编译它并为其创建一个工厂以便在需要时使用。