Использование компонента из импортированного модуля внутри дочерних модулей

У меня есть модуль, который экспортирует компонент, чтобы предоставить его другим модулям, я хочу использовать этот компонент в модулях, которые являются дочерними элементами другого модуля, я импортирую первый модуль в родительский модуль, чтобы разрешить использование внутри дочерних модулей, но я я не совсем уверен, что это лучший способ сделать это.

Это мой общий модуль в корневой папке с компонентом, который я хочу использовать:

app/shared/shared.module.ts

import {dtComponent} from './dt.component';

@NgModule({
  imports: [
    CommonModule
  ],
  exports: [
    dtComponent
  ],
  declarations: [
    dtComponent
  ]
})
export class DatePModule{ }

У меня есть другой модуль в папке приложения, который импортирует DatePModule следующим образом:

приложение/контакты/contacts.module.ts

import {DatePModule} from '../shared/shared.module.ts';

@NgModule({
  imports: [
    CommonModule,
    DatePModule
  ]
})
export class CTModule{ }

Мне нужно использовать dtComponent непосредственно в некоторых компонентах CTModule, но также мне нужен этот компонент в другом компоненте, который находится в дочерних модулях CTModule.

Я могу сделать это, снова импортировав DatePModule внутри дочерних модулей CTModule, но я не уверен, что это лучший подход.

app/contacts/other/other.module.ts

import {DatePModule} from '../../shared/shared.module.ts';

@NgModule({
  imports: [
    CommonModule,
    DatePModule
  ]
})
export class OtherModule{ }

Мой вопрос: зачем мне снова импортировать DatePModule, если он уже импортирован в родительский модуль? Если я удалю этот импорт в OtherModule, компонент dtComponent не будет распознан как часть модуля.


angular angular-components angular-module
person xzegga    schedule 14.08.2017    source источник
comment
вы используете ленивую загрузку?   -  person Max Koretskyi    schedule 14.08.2017
comment
@Maximus да, я использую ленивую загрузку для загрузки всех модулей и компонентов.   -  person xzegga    schedule 14.08.2017
comment
хорошо, мой ответ все еще актуален, разделяемый и лениво загруженный модуль будет объединен, а инкапсуляция разрешена при объединении   -  person Max Koretskyi    schedule 14.08.2017

Ответы (1)


arrow_upward
6
arrow_downward

почему мне нужно снова импортировать DatePModule, если он уже импортирован в родительский модуль

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

Чтобы узнать больше, прочитайте Избегайте распространенных путаниц с модулями в Angular . Вот цитата:

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

Однако модуль imports/exports может обеспечить инкапсуляцию объявляемых типов во время компиляции. Если вы хотите использовать объявляемые типы из другого модуля, вы должны явно импортировать этот модуль или другой модуль, который повторно экспортирует требуемый модуль. Компилятор управляет инкапсуляцией при анализе шаблонов, а явный импорт предоставляет контекст, чтобы знать, что определенные компоненты могут использоваться в качестве дочерних элементов в шаблоне.

Я могу сделать это, снова импортируя DatePModule внутри дочерних модулей CTModule, но я не уверен, что это лучший подход.

Это правильный подход, если вы хотите использовать объявляемые типы из DatePModule внутри OtherModule.

person Max Koretskyi    schedule 14.08.2017