Угловая загрузка ленивых модулей и ошибка entryComponents

Question

Я лениво загружаю угловой модуль и при попытке открыть мой DatesModal я получаю эту ошибку:

No component factory found for DatesModal. Did you add it to @NgModule.entryComponents?

Мой lazyModule выглядит так:

declarations: [DatesModal] entryComponents: [DatesModal]

Я определенно добавляю DatesModal в массив entryComponents модуля lazyModule. Кто-нибудь понял, что мне здесь не хватает?

Пожалуйста, дайте мне знать, если вам нужна дополнительная информация, чтобы ответить на этот вопрос.

Answer 1

Использовали ли вы какую-либо стороннюю библиотеку (или себя) для динамического создания этого компонента в модуле с отложенной загрузкой?

Если это так, вам нужно добавить этот компонент в модуль AppModule (или не на уровень выше). -lazy-load module) entrycomponents.

Более подробно вы можете увидеть этот выпуск

Answer 2

Похоже, вы хотите получить / импортировать этот модуль в другие модули, однако этот модуль не виден другим. Попробуйте экспортировать свой модуль:

exports: [DatesModal]

ОБНОВЛЕНИЕ:

Как говорит Angular docs:

Для производственных приложений, которые вы хотите загрузитьНаименьший возможный код. Код должен содержать только те классы, которые вам действительно нужны, и исключать компоненты, которые никогда не используются. По этой причине Angular-компилятор генерирует код только для компонентов, которые доступны из entryComponents;Это означает, что добавление дополнительных ссылок на @ NgModule.declarations не означает, что они обязательно будут включены в окончательный комплект. Если компонент не является компонентом ввода и не найден в шаблоне, шейкер дерева выбросит его. Поэтому лучше всего добавлять только те компоненты, которые действительно являются входными компонентами, чтобы поддерживать ваше приложение как можно более аккуратным.

Чтобы ваш модуль был загружен lzay, вам нужно выполнить в маршрутах:

const routes: Routes = [
  {
    path: 'customers',
    loadChildren: () => import('./customers/customers.module').then(mod => mod.CustomersModule)
  },
  {
    path: 'orders',
    loadChildren: () => import('./orders/orders.module').then(mod => mod.OrdersModule)
  },
  {
    path: '',
    redirectTo: '',
    pathMatch: 'full'
  }
];

Прочитайте эту документацию о том, как сделать ваши модули загруженными с отложенным доступом.