0

我有一个 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 指出的那样，Angular 11 和 Angular 11 中存在不兼容的依赖项。我已将 lib 更新为对ng-dynamic-componenticell-data-table具有适当的依赖项，现在是 Angular11 版本（^8.0.0）。

但是 stackblitz 示例仍然显示错误:(

4

1 回答 1

1

这里的问题是在 stackblitz 你有两个版本的@angular/common包。

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

前者在 Angular 注册提供者时使用，后者在需要解析提供者时发挥作用。

让我们看看为什么 Angular 无法解析该NgComponentOutlet令牌。这里有一个简单的解释：

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

该类NgComponentOutlet在两个捆绑包中都定义了，它们甚至看起来都一样，但是由于 Angular 使用Map对象来解析提供程序，因此由于Map键相等而失败是基于sameValueZero 算法

现在，为什么我们在 stackblitz 中有两个版本的 Angular 包。那是因为@i-cell/data-table使用ng-dynamic-component@6.1.0取决于Angular 9

所以，一旦你解决了这个版本的不兼容问题，你应该得到像Forked Stackblitz这样的东西

于 2021-02-06T06:19:23.620 回答