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是LOGIN模块中的页面，我不想为它创建单独的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 中添加对此页面的引用，并在引用中添加

＆＃13;

＆＃13;

    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 { }

＆＃13;

＆＃13;

＆＃13;

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

Answer 2

您需要在虚拟文件夹中添加dummy.module.ts，这样才能解决问题。

请查看related github project。

Answer 3

您是否尝试使用字符串调用？

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