Ionic 3 延迟加载 - 无组件工厂

Question

对于 ionic-3 项目，我们使用延迟加载。我们的模块“ LOGIN ”正在延迟加载。一切正常，但是当我们尝试使用 NAV CONTROLLER 在 LAZILY LOADED 模块内的页面之间导航时 - 我们得到运行时错误 "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 是登录模块内部的页面，我不想为其创建单独的 NG 模块 - 因此使用 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 离线编译它并为其创建工厂以供需要时使用。

Answer 2

你需要在虚拟文件夹中添加一个dummy.module.ts，这将解决问题。

一定要看看related github project。

Answer 3

你试过用字符串调用吗？

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

Ionic 3 延迟加载 - 无组件工厂

Ionic 3 Lazy Loading - No Component Factory

ionic3

angular