Унаследовать импорт от родительского модуля к дочернему модулю в Angular2

Question

Я сделал приложение Angular2, как описано here. Он имеет два компонента (A, B), которые импортируются глобальным app.module. Моя идея состояла в том, чтобы включить общие модули в app.module, поэтому мне не нужно испортить каждый модуль с избыточным кодом. Я хочу сделать это, например, с помощью FormsModule. Таким образом, в app.module у меня есть

imports: [ 
    UniversalModule, 
    CommonModule, 
    FormsModule, 
    AModule 
    RouterModule.forRoot([]) 
], 

exports: [FormsModule] 

Но в модуле А я получил исключение Can't bind to 'ngModel' since it isn't a known property of 'select'., который, кажется, вызванное отсутствующего FormsModule. Он работает только тогда, когда я импортирую FormsModule в каждый дочерний модуль, используя imports: [FormsModule]. Именно этого я и хочу избежать.

По this question, я пытался импортировать AppModule в модуле ребенка А. Это не работает и дает мне исключение Exception: Call to Node module failed with error: Error: Unexpected value 'undefined' imported by the module 'AModule'

Как я могу унаследовать импорт в дочерние модули? Мне тоже нужно это для труб.

Answer 1

Просто создайте функциональный модуль (или общий модуль), который экспортирует компоненты, директивы и каналы, которые обычно используются вместе и импортируют этот модуль в модули, в которых вы хотите использовать любой из них.

Существует нет способа сделать компоненты, директивы или трубы доступными по всему миру. Они должны быть добавлены к импорту каждого модуля, в котором они используются. Все, что вы можете сделать, это объединить модули и сделать их доступными, импортировав только один или несколько модулей.

Answer 2

Похоже, что это можно сделать только с использованием общего модуля, который собирает общий импорт, например, @ Günter Zöchbauer. Я нашел an example in the official docs, который я использовал в качестве основы для создания моего общего модуля для этого:

import { CommonModule } from '@angular/common'; 
import { NgModule } from '@angular/core'; 
import { FormsModule } from '@angular/forms'; 

import { ObjectKeysPipe } from './../shared/pipes/object-keys.pipe'; 

@NgModule({ 
    imports: [CommonModule], 
    declarations: [ 
     ObjectKeysPipe 
    ], 
    exports: [ 
     CommonModule, 
     FormsModule, 
     ObjectKeysPipe 
    ] 
}) 
export class GlobalSharedModule{} 

Это разделяет пользовательские трубы от меня (ObjectKeysPipe), и оба широко используются CommonModule и FormModule. Идея сокращения беспорядочного беспорядка сработала. В моих модулях приложения мне не нужно добавлять кучу импорта/деклараций. Вместо этого мне нужно только импортировать мой общий модуль следующим образом:

import { GlobalSharedModule } from './../shared/global-shared.module'; 
@ngModule({ 
    imports: GlobalSharedModule 
})