具有根級別導入的Angular2應用程序模塊

Question

根本級別的導入不應該全局可用（全局我指的是所有子模塊和組件）？

我有以下root / app模塊：

import { BrowserModule } from '@angular/platform-browser';
import { NgModule, ApplicationRef } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { AppComponent } from './app.component';
import { HttpModule } from '@angular/http';
import { RouterModule } from '@angular/router';
import { appRouterProviders, routing } from './app.routes';
import { DashboardModule } from './dashboard/dashboard.module';
import { DecisionModule } from './decision/decision.module';
import { MdCoreModule }           from '@angular2-material/core';
import { MdButtonModule }         from '@angular2-material/button';
import { MdCardModule }           from '@angular2-material/card';
import { MdListModule }           from '@angular2-material/list';
import { MdSidenavModule }        from '@angular2-material/sidenav';
import { MdToolbarModule }        from '@angular2-material/toolbar';
import { MdIconModule }           from '@angular2-material/icon';

@NgModule({
  declarations: [
    AppComponent                    
  ],
  imports: [
    BrowserModule,
    CommonModule,
    FormsModule,
    HttpModule,
    RouterModule,    
    routing,
    DashboardModule,
    MdCoreModule,
    MdButtonModule,
    MdCardModule,
    MdListModule,
    MdSidenavModule,    
    MdToolbarModule,
    MdIconModule
  ],
  providers: [
    appRouterProviders
  ],
  entryComponents: [ AppComponent ],
  bootstrap: [ AppComponent ]
})
export class AppModule {

}

如果我嘗試使用我的一個子模塊中的材料元素，它們不顯示，這就是子模塊的樣子：

import { NgModule }               from '@angular/core';
import { CommonModule }           from '@angular/common';
import { FormsModule }            from '@angular/forms';
import { dashboardRouting }       from './dashboard.routes';
import { DashboardComponent }     from './dashboard.component';
import { ActionsDialogComponent } from './actions-dialog';

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    dashboardRouting,    
  ],
  declarations: [
    DashboardComponent,
    ActionsDialogComponent    
  ],
  providers: [    
  ]
})
export class DashboardModule {}

但是，如果我導入它們顯示的子模塊中的材料模塊。 這是材料設計組件工作時子模塊的樣子：

import { NgModule }               from '@angular/core';
import { CommonModule }           from '@angular/common';
import { FormsModule }            from '@angular/forms';
import { dashboardRouting }       from './dashboard.routes';
import { DashboardComponent }     from './dashboard.component';
import { ActionsDialogComponent } from './actions-dialog';
import { MdCoreModule }           from '@angular2-material/core';
import { MdButtonModule }         from '@angular2-material/button';
import { MdCardModule }           from '@angular2-material/card';
import { MdListModule }           from '@angular2-material/list';
import { MdSidenavModule }        from '@angular2-material/sidenav';
import { MdToolbarModule }        from '@angular2-material/toolbar';
import { MdIconModule }           from '@angular2-material/icon';

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    dashboardRouting,
    MdCoreModule,
    MdButtonModule,
    MdCardModule,
    MdListModule,
    MdSidenavModule,    
    MdToolbarModule,
    MdIconModule,
  ],
  declarations: [
    DashboardComponent,
    ActionsDialogComponent    
  ],
  providers: [    
  ]
})
export class DashboardModule {}

如果材料模塊已經在根級別導入，為什么必須再次在子級別上導入材料模塊？

Answer 1

Angular的文檔令人困惑，他們在幾個方面說明你在根模塊中導入的模塊（ app.module.ts ）是全局可用的，但除非你仔細閱讀（blah），否則當你使用子模塊時它不會很明顯打破繼承和子模塊為組件創建自己的應用程序域（不是服務，服務仍然是全局的，至少我讀它的方式）。 這也是為什么如果你像我一樣，我注意到我必須將一些物品導入我的子模塊，而其他一些我並沒有真正困惑我的原因。 這是討論這個問題的angular.io部分： NgModule.html

還有一些值得一提的：我認為在Angular2中進行開發，因為RC5 +意味着我需要將我的所有功能都包裝到模塊中，事實並非如此。 除非你想使用延遲加載或者特別希望與其他人共享代碼，例如npm包，否則模塊對於我們在Angular2的日常工作中構建並不是必需的。

Answer 2

在Angular2中的組件概念中，沒有什么比您所指的“根級別”更好。
組件是模塊化的部分，非常類似於Java（或任何高級語言）項目中的類 - 您還可以導入您使用的每個類。
它們可以嵌套或互相使用，但仍然每個組件都需要導入自己的依賴項。
請注意，在Angular2中導入是一種非常不同的方法，而不是在Angular 1中包含外部模塊/庫（然后基本上在index.html中為每個依賴項創建一個新引用）。
首先是Angular 2中的那些導入，因為Typescript編譯器需要知道組件中使用的是什么（因此增加了一些功能來進行錯誤檢查）
編譯和打包的構建應該只包含一次依賴（假設一切都正確配置）。