Как использовать компонент из модуля в entryComponents другого модуля?

У меня есть модальный компонент ngx-bootstrap. Этот модал используется внутри папки shared. Я использую это FirstModalComponent в своем DashboardModule как:

// Dashboard.module.ts
import { FirstModalComponent } from '../../shared/modals/first-modal/first-modal.component';

@NgModule({
  declarations: [
    DashboardComponent
  ],
  imports: [
    CommonModule,
    ReactiveFormsModule,
    RouterModule.forChild(routes),
    SharedModule
  ],
  entryComponents: [
    FirstModalComponent 
  ]
});

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

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

import { FirstModalModule } from './first-modal/first-modal.module';

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

Затем я импортирую/экспортирую этот ModalsModule в SharedModule и пытаюсь импортировать общий модуль в DashboardModule.

Как мне теперь добавить свои FirstModalComponent в entryComponents в Dashboard?

Я получаю сообщение об ошибке, когда пытаюсь импортировать FirstModalComponent и помещать в entryComponents: Component is part of the declaration of 2 modules.

P.S. Я не уверен, что это хорошая идея, чтобы сделать его как модуль.

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
5
0
4 403
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вы должны объявлять FirstModalComponent только в одном module. Он может быть частью одного модуля и экспортироваться им, а также может быть определен как entryComponent для своего собственного модуля.

Для вашего случая объявите его как

entryComponents: [ FirstModalComponent ]

для FirstModalModule и экспортировать FirstModalComponent из FirstModalModule. Он будет работать, как и ожидалось, когда вы импортируете FirstModalModule внутри ModalsModule или любого другого модуля в вашем приложении.

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

Другие вопросы по теме