具有根级别导入的Angular2应用程序模块

Question

不应该在根级别导入全局可用（对于全局来说，我指的是所有子模块和组件）？

我有以下根/应用模块：

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

在Angular2的组件概念中，没有什么像您所指的“根级别”。
组件是非常像Java中的类（或任何高级语言）项目的模块化部分 - 您还可以导入您使用的每个类。
它们可以互相嵌套或使用，但每个组件仍需要导入自己的依赖关系。
请注意，在Angular2中导入是一种非常不同的方法，而不是在Angular 1中包含一个外部模块/库（然后基本上在每个依赖项的index.html中新建一个引用）。
那些在Angular 2中的导入是第一次的，因为Typescript编译器需要知道你的组件中使用了什么（因此增加了一些更多的功能来进行错误检查）
编译和打包的版本应该只包含一次依赖只要一切配置正确）。

Answer 2

角的文档是混乱的，他们在几个方面指出模块在根模块（app.module.ts）中导入全球都可以，但除非你读透的是不能很快明显（等等）是，当你使用一个子模块它打破继承和子模块创建它自己的组件的应用程序域（不是服务，服务仍然是全球性的，至少我阅读它的方式）。这也是为什么如果你像我一样，我注意到我必须导入到我的子模块中的一些项目，而其他我没有让我困惑的项目。这里讨论angular.io的一节：NgModule.html

其他值得一提的东西：我认为从RC5 +开始在Angular2中开发意味着我需要将所有功能包装到模块中，但事实并非如此。除非您想使用延迟加载或特别希望与其他人共享代码，例如npm包，否则模块对我们来说并不是真的需要在Angular2中进行常规的日常工作。