angular - 角元素错误。“未能构造 'HTMLElement ...'

Question

我正在stackblitz上尝试一个非常简单的角度元素应用程序，我遇到了以下问题。

错误：无法构造“HTMLElement”：请使用“new”运算符，此 DOM 对象构造函数不能作为函数调用。

我要做的就是尝试显示你好世界。我在本地的可视化代码上没有遇到任何问题，但是，这个问题出现在 stackblitz 上。不确定我是否必须在 stackblitz 上执行一些额外的步骤才能运行此应用程序。感谢您对此的任何帮助。

这是stackblitz上应用程序的链接。

Answer 1

降级document-register-element解决v1.8.1它。

npm i document-register-element@1.8.1

为我工作。

铬。https://github.com/angular/angular/issues/24390#issuecomment-396729418

Answer 2

如果有人遇到这个问题，并且仍然想要定位ES5（出于 IE 兼容性或其他原因），另一个合理的解决方案是使用Web 组件 ES5 适配器 polyfills。

# Install the package
npm install @webcomponents/webcomponentsjs --save-dev

# Then add the following line in Polyfills.ts
import '@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js'; 

从这个GitHub 问题。

Answer 3

对于遇到此问题的任何人，只需更改tsconfig.json 文件中的targettoes6或in 即可。es2015这将完美地工作。

Answer 4

使用 Angular 8 的目标版本为 es2015 可以实现差异加载，最终会为 es5 和 es2015 版本提供不同的构建文件。

如果不需要上述内容，理想的解决方法是降级 document-register-element@1.8.1。

任何版本 >=1.7.2 <=1.8.1 都应该可以工作。