首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >导入所有模块中可用的角度组件

导入所有模块中可用的角度组件
EN

Stack Overflow用户
提问于 2017-02-07 04:43:51
回答 1查看 3.3K关注 0票数 2

我最近开始玩角形2,到目前为止我的经验是非常棒的。我对ng1React也有一些很好的经验。所以,这是一个普遍的问题,也是一个混乱的问题。我很肯定这会帮助很多其他人,而且我还没有找到任何直接的答案。

假设我有这个module protected.module.ts,其中注册了一些组件。因此,为了使用基本指令ngFor, ngIf,我必须将CommonModule导入到特定模块,但同时还必须将其导入主条目模块,即app.module.ts

app.module.ts

代码语言:javascript
运行
复制
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 { }

protected.module.ts

代码语言:javascript
运行
复制
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中全局导入某个模块?用这种方式,我认为我们需要把它进口到不同的地方,这似乎是一次彻底的改革。还是我完全错过了一点?

事先谢谢你,我真的希望这对我和其他人都有好处。

EN

Stack Overflow用户

回答已采纳

发布于 2017-02-07 05:19:23

我想你最好和共享模块一起吃

您的另一个modules (在我的经验中通常是feature modules )都可以导入这个shared module

如文档中所述,可以通过让SharedModule重新导出公共依赖项(例如CommonModuleFormsModule )来减少重复的导入语句。

例如,您可以拥有一个共享模块,只需重新导出BrowserModuleFormsModuleHttpModule,如下所示:

代码语言:javascript
运行
复制
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导出的所有,而无需再次显式导入它。

代码语言:javascript
运行
复制
import { NgModule } from '@angular/core';
import { SharedModule } from './path_to_shared_module/shared.module';
...

@NgModule({
    imports: [SharedModule, ...],
    ...
})
export class OtherModule { }
票数 8
EN
查看全部 1 条回答
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/42081915

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档