angular2中的嵌套組件

Question

我打算將我對angular2的知識從版本Rc5更新至2.2。 我有指令性質的問題，因爲我升級我的packages已被棄用。我知道它移動到進口 NgModule裝飾器屬性，但它叫共享組件但當我有非常大數量的組件，我必須移動從每個組件的指令到我的應用程序在NgModule的起點，因此我的所有組件都必須在開始時加載，我不知道是否有辦法將組件的指令帶回到其他組件的延遲加載組件。

Answer 1

正如我的朋友告訴的，在角度上嵌套組件已被棄用，而不是模塊加載進來。這裏是我如何實現，在我的方式： 第一，我發現，我們可以延遲加載新的路由器模塊，所以我組件化我的應用領域，並改變我的主模塊

import { NgModule }  from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import {homeComponent} from './appComponent/homeComponent.Component' 
import { AppComponent } from './appComponent/app.component'; 
import {RouterModule} from '@angular/router' 

@NgModule({ 
    imports:  [ BrowserModule, 
    RouterModule.forRoot([ 
     { path: '', redirectTo: 'home', pathMatch: 'full' }, 
     { path: 'home', component: homeComponent }, 
     { path: 'lazy1', loadChildren: './dist/app/detailComponent/detailModule.Module#detailModule' } 

    ], {}) 
    ], 
    declarations: [ AppComponent,homeComponent ], 
    bootstrap: [ AppComponent ] 
}) 
export class AppModule { } 

末根路徑表明，如何我們可以ASIGN一個模塊代替進口組件，然後我們配置我們的孩子航線第二個模塊和行爲像這樣：

import { NgModule }  from '@angular/core'; 
import { DetailComponent } from '../detailComponent/detail.component' 
import { RouterModule, Route, Router} from '@angular/router'; 

@NgModule({ 
    imports:[ RouterModule.forChild([ {path: '', component: DetailComponent}])], 
    declarations: [ DetailComponent ] 
}) 
export class detailModule { } 

因爲這個代碼顯示了我們可以配置我們的第二個層次的模塊加載其成分和使用它首先減少網絡負載（使用systemjs）並在用戶單擊菜單鏈接時加載它。 注意，我們可以繼續在第二級模塊路由配置嵌套我們的模塊

此外，我們可以加載模塊和其與名爲SystemJsNgModuleLoader