離子3延遲加載 - 無組件工廠

對於離子-3項目，我們使用的是懶惰加載。我們的模塊「LOGIN」正在被加載。一切工作正常，但是當我們嘗試使用導航控制器在頁面之間導航內的延遲加載的模塊 - 我們得到的運行時錯誤「NO件廠」離子3延遲加載 - 無組件工廠

下面的代碼

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

 
}

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

如上所見，我已經加入DUMMY.TS和entryComponents

的錯誤是：

來源

2017-05-04 Shouvik S Mazumdar

還沒有試過，但嘗試'IonicPageModule.forChild（DummyPage）'進口 –

作品！謝謝！ –

好的..添加爲答案 –

溶液在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 { }

猜測離子是治療DummyPage作爲一個動態加載的頁面，我們需要告訴app.module.ts脫機編譯並創建一個工廠爲它在需要時使用。

來源

2017-05-04 13:33:51

我確實有同樣的問題，但我認爲新模塊的目的之一是你不必在頂部'聲明'和'entryComponents'中添加頁面。我不認爲這是正確的做法... –

這適用於一箇舊的項目！然而，它不是必要的新離子3創建項目。 – Pal

您需要在虛擬文件夾中添加一個dummy.module.ts，這將解決問題。

請看related github project。

來源

2017-07-18 01:54:46 laker

我有同樣的問題。這確實花了我很多時間。感謝@ laker的回答。它確實幫了我很大忙。 Aactually。你只需要將虛擬對象看作一個模塊。那麼你可以用'module-name'傳遞給它。那麼一切工作正常。 –

-1

你有沒有試過用字符串調用？

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

來源

2017-08-17 17:22:36

離子3延遲加載 - 無組件工廠

回答

相關問題