打字稿“类型元素上不存在属性”

Question

我正在开始使用 Typescript 的旅程。所以我在我的 Html 中有 video 标记，在 .ts 文件中有这些行：

 ...
class KomakhaPlayer {
  private container = ...;
  private video: Element = this.container.getElementsByClassName( 'video' )[ 0 ];
  private controls = ...;

  constructor(){
    this.video.controls = false; // ts error
    ...
  }
}
...

如您所见 this.video 具有 Element 类型，但低于 this.video.controls 向我抛出 Typescript 错误 Property ‘controls’ does not exists on type ‘Element’ 。

临时我改了 Element 输入 any ，但我想 知道 如何正确解决这个错误并在以后处理类似的问题。提前致谢！

解决方案： 所以正确的方法是这样定义的：

 private video: HTMLVideoElement = <HTMLVideoElement>this.container.getElementsByClassName( 'video' )[ 0 ];

@deceze 在下面的评论中进行了解释

原文由 lomboboo 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

Element 是一个非常通用的根对象，它确实没有 controls 属性。请参阅 https://developer.mozilla.org/en-US/docs/Web/API/Element 。您正在寻找的是 HTMLVideoElement ，它继承自 HTMLMediaElement ，它具有 controls 属性。

打字稿是完全正确的：你告诉它你正在使用 Element ，并且打字稿警告你 Element 不知道有 controls

原文由 deceze 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

您需要像这样声明类型：

 const video = document.getElementById('video') as HTMLVideoElement | null;

原文由 Richard 发布，翻译遵循 CC BY-SA 4.0 许可协议