Typescript Error: Property 'append' does not exist on type 'HTMLElement'

Question

问题：

我在尝试将已编译的 angular 1.5 模板附加到现有 HTMLElement.

时收到 Typescript 2.2.1 编译错误

代码：

$document.find(scope.target)[0].append($compile(menu)(scope)[0]);

编译错误：

[ts] Property 'append' does not exist on type 'HTMLElement'

我搜索了类型定义，但没有看到 append() 的签名。

关于我应该使用哪种类型或版本的打字稿有什么想法吗？

谢谢！

Answer 1

这里与TypeScript无关。

正确的调用方法是appendChild:

https://developer.mozilla.org/en/docs/Web/API/Node/appendChild

append 是一种 jQuery 方法，如果你想使用它，你可以这样做：

$document.find(scope.target).append($compile(menu)(scope)[0]);

它也应该有效。

希望对你有帮助

Answer 2

HTMLElement 上有一个 append/prepend 函数。问题是currently still experimental。

为了在不从 TypeScript 中获取错误的情况下使用它，我将它用作任何 ¯\_(ツ)_/¯ (<any>myElement).append(otherElement)

Answer 3

Element.append() 现在存在（自 2016 年起）。如果 TypeScript 发现错误：

• 类型：确保它是 Element 而不仅仅是 Node
• 配置：确保您正在加载 DOM 库
• 配置：确保您使用的是最新的 ES target/lib

示例配置：

{
  "compilerOptions": {
    "target": "es2020",
    "lib": ["dom", "es2019", "es2020", "dom.iterable"]
  }
}