Нет провайдера для "NgComponentOutlet"

У меня есть приложение Angular 11, которое импортирует @angular/material, @ngx-translateи библиотека под названием icell-data-table .

Скачав пример проекта со страницы github, я смог запустить его без каких-либо проблем в моей локальной среде.

Но при извлечении его в демо Stadckblitz я столкнулся со странной ошибкой:

      Error in /turbo_modules/@angular/compiler@11.1.1/bundles/compiler.umd.js (3057:21)
Template parse errors:
No provider for NgComponentOutlet ("onentTemplate [cellTemplate]="'componentTemplate'" let-row="row" let-col="col" let-idx="rowIdx">
[ERROR ->]<ng-container
*ngComponentOutlet="col.component; ndcDynamicInputs: getComponentInputs(row, col);"): ng:///DataTableModule/CellTemplatesComponent.html@23:2

С проектом Stackblitz можно ознакомиться здесь . Есть идеи, чего в нем не хватает?

Обновление 1: как указал @yurzui, в icell-data-tableи Angular 11. Я обновил библиотеку с правильной зависимостью от ng-dynamic-component, которая теперь является версией Angular11 (^8.0.0).

Но пример stackblitz по-прежнему отображает ошибку :(

1 ответ

Проблема здесь в том, что в stackblitz у вас есть две версии @angular/commonупаковка.

      @angular/common@11.1.1
@angular/common@9.1.13

Первый используется, когда Angular регистрирует провайдеров, второй вступает в игру, когда пришло время разрешить провайдера.

Давайте посмотрим, почему Angular не может разрешить этот токен. Вот простое объяснение:

      import { NgComponentOutlet as outlet1 } from "@angular/common@11.1.1";
import { NgComponentOutlet as outlet2 } from "@angular/common@9.1.3";
 

const providers = new Map();
providers.set(outlet1, 'Any value');

console.log(providers.has(outlet2)); // false

The NgComponentOutletкласс определен в обоих пакетах, и они даже выглядят одинаково, но поскольку Angular использует объект для разрешения поставщиков, он терпит неудачу из-за Mapравенство ключей основано на алгоритме sameValueZero

Теперь, почему у нас есть две версии пакета Angular в stackblitz. Это потому что @i-cell/data-tableиспользует ng-dynamic-component@6.1.0который зависит от Angular 9

Итак, как только вы решите несовместимость этих версий, вы должны получить что-то вроде Forked Stackblitz.

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