3

我最近开始玩 angular 2，到目前为止我的经验非常棒。ng1我也有一些很好的经验React。所以，这更像是一个普遍的问题，也是一个困惑。我很确定这会帮助很多其他人，而且我还没有真正找到任何直接的答案。

所以假设我有这个module protected.module.ts，我注册了一些组件。因此，为了使用原始指令ngFor, ngIf，我必须将其导入CommonModule特定模块，但与此同时，我必须将其导入主入口模块，即app.module.ts.

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { CommonModule  } from '@angular/common';
import { AlertModule  } from 'ng2-bootstrap';
import { LayoutModule } from './layout/layout.module';
import { UsersModule } from './users/users.module';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { ProtectedModule } from './protected/protected.module';
import { PageNotFoundComponent } from './shared/components/not-found.component';

@NgModule({
  declarations: [
    AppComponent,
    PageNotFoundComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    CommonModule,
    HttpModule,
    AlertModule.forRoot(),
    LayoutModule,
    ProtectedModule,
    UsersModule,
    AppRoutingModule,
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

受保护的模块.ts

import { NgModule } from '@angular/core';
import { CommonModule  } from '@angular/common';
import { HomeComponent } from './home/home.component';
import { ProtectedRoutingModule } from './protected-routing.module';

@NgModule({
  imports: [ProtectedRoutingModule, CommonModule],
  declarations: [HomeComponent],
  exports: [HomeComponent]
})
export class ProtectedModule { }

app.module所以，我的困惑是，如果我们想在我们最终拥有的所有模块中使用该模块，是否有一种方法可以全局导入某个模块？通过这种方式，对我来说，我们需要将它导入到不同的地方，这似乎是一种大修。还是我在这里完全遗漏了一些观点？

提前谢谢你，我真的希望这对我和其他人都有好处。

4

1 回答 1

8

我认为您最好使用 共享模块

您的其他人modules（通常feature modules以我的经验）都可以导入 this shared module。
如文档中所述，您可以通过SharedModule重新导出公共依赖项来减少重复的导入语句，例如CommonModule，FormsModule

例如，您可以只重新导出一个共享模块BrowserModule，如下所示：FormsModuleHttpModule

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { HttpModule } from '@angular/http';
import { FormsModule } from '@angular/forms';

@NgModule({
    exports: [BrowserModule, FormsModule, HttpModule]
})
export class SharedModule { }

然后在你的其他模块中，而不是导入那些相同的模块，只需导入SharedModule下面的内容。导入 的每个模块SharedModule都可以使用从导出SharedModule的所有内容，而无需再次显式导入。

import { NgModule } from '@angular/core';
import { SharedModule } from './path_to_shared_module/shared.module';
...

@NgModule({
    imports: [SharedModule, ...],
    ...
})
export class OtherModule { }
于 2017-02-07T05:19:23.313 回答