Question

我们正在使用Angular6构建MEAN Web应用程序。我们有某些功能模块，例如FormGeneratorModule和GridGeneratorModule。

我们想要的是这些应该仅在根appModule中导入一次，并且所有其他子模块都应该可以直接访问它，即不必将它们导入要使用它们的每个子模块中。

我已经对此进行了研究，并相应地实现了这些功能模块（导出了将要使用的组件以及所有内容）。我还在我的根模块中导入了BrowserModule，并在所有子模块中导入了CommonModule（用于延迟加载）。但这似乎仍然不起作用，每当我在其他模块中使用这些功能模块时，我仍然必须导入这些功能模块。这是完全不希望的，因为它们是非常繁重的模块。

作为参考，我在此处放置一些代码段：

根AppModule.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule as NgController, NO_ERRORS_SCHEMA, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { HttpClientModule } from '@angular/common/http';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';

import { HomeComponent } from '@L3Modules/default/controllers/home/home.component';
import { FormsModule } from '@L3Modules/default/controllers/forms/forms.module';
import { FormGeneratorModule } from '@L3Modules/core/controllers/formGenerator/formGenerator.module';
import { GridGeneratorModule } from '@L3Modules/core/controllers/gridGenerator/gridGenerator.module';


const routing: ModuleWithProviders = RouterModule.forRoot(routes);
@NgController({
  declarations: [
    HomeComponent
  ],
  imports: [
    BrowserModule,
    routing,
    HttpClientModule,
    BrowserAnimationsModule,
    FormsModule,
    FormGeneratorModule,
    GridGeneratorModule,
    NgbModule.forRoot()
  ]
})

功能模块：

formGenerator.module.ts ：

@NgModule({
imports: [
    CommonModule,
    ReactiveFormsModule,
    routing,
    NgbModule,
],
declarations: [
    FormGeneratorComponent,
   ...
],
exports: [
    ...ALL the components
],
entryComponents: [
    BComponent,
    AComponent,
    DComponent,
    ...

],
providers: [DService],
schemas: [NO_ERRORS_SCHEMA, CUSTOM_ELEMENTS_SCHEMA]

gridGenerator.module.ts ：

declarations : [
    ChComponent,
    PUComponent,
    DTComponent,
],
imports : [
    CommonModule,
    ReactiveFormsModule,
    NgbModule,
    FormsModule
],
exports: [DTComponent],
providers: [],
entryComponents: [],
schemas: [NO_ERRORS_SCHEMA]

如果有人能在这里为我提供一些帮助，那太好了，为了避免在使用它们的每个模块中导入这些巨型功能模块，我想不到我缺少的东西。预先感谢。

Answer 1

您可以简单地将AppModule导入每个功能模块：

formGenerator.module.ts 或 gridGenerator.module.ts

import { AppModule } from './../app.module';

@NgModule({
  imports: [
    AppModule
    ...
  ]

值得一提的是，这样做没有性能上的优势

不导入就无法访问功能模块

1 个答案: