如何在Angular2中延遲加載單個組件（RC5）

我已經能夠獲得延遲加載，以便使用Route的指定loadChildren屬性使用NgModules。如何在Angular2中延遲加載單個組件（RC5）

import {RouterModule} from ‘@angular/router’ 
import {NgModule} from ‘@angular/core’ 
@NgModule({ 
    declarations: [ MyComponent, MyHomeRoute ], 
    bootstrap: [ MyComponent ], 
    imports: [ 
    RouterModule.forRoot([ 
    { path: ‘home’, component: MyHomeRoute }, 
    { path: ‘lazy’, loadChildren: ‘./my-lazy-module’ } 
    ]) 
}) 
class MyAppModule {}

但有組態路徑到延遲加載單個組件使用字符串爲「組分」屬性（而不是一個NgModule）的方法嗎？

我總是最後歌廳這樣的錯誤：

import { Routes, RouterModule } from '@angular/router'; 
const routes: Routes= [{path: 'welcome', loadChildren: 'app/screens/welcome.module'}]; 
export const routing = RouterModule.forRoot(routes);

這裏：

來源

2016-08-15 noxborough

您可以將組件移動到它自己的模塊。 –

好吧......我知道。如果只包裝一個組件，它看起來似乎更不必要的「模板化」。你是說這是唯一的方法嗎？因爲我看到Route的「component」屬性被允許爲一個字符串，所以它似乎可能有延遲加載組件的工作意圖。 – noxborough

這是RC.5之前的方式。我不知道是否應該繼續工作。 –

@NgModule({ 
    imports:  [ BrowserModule, routing ], 
    declarations: [ AppComponent ], 
    bootstrap: [ AppComponent ] 
}) 
export class AppModule { }

然後按需加載「不能使用 'lazyComponent' 解決組件」 loadChildren：「應用程序/screens/welcome.module'爲ts文件的應用程序/屏幕/ welcome.module.ts

欲瞭解更多詳情ex充足，檢查了這個：http://plnkr.co/edit/18CZVF?p=preview

來源

2016-08-23 08:05:13 Jaishankar

@GunterZochbauer推薦的相同解決方案。 – noxborough

單擊其中的鏈接時，Plunkr文件不會執行任何操作 – TetraDev

如何在Angular2中延遲加載單個組件（RC5）

回答

相關問題