'play' 在类型 'HTMLElement' 上不存在并且 属性 'value' 在类型 'EventTarget' 上不存在

Question

不知道为什么会出现这两个警告。 有什么想法可以从打字稿中删除那些警告信息吗？ 谢谢

错误 TS2339：属性 'play' 在类型 'HTMLElement' 上不存在。

    export function playAudio(e, audioId) {
        e.preventDefault()
        let audioPlayer: HTMLElement = document.getElementById(audioId)
        audioPlayer.play();
    }

(248,82)：错误 TS2339：属性 'value' 在类型 'EventTarget' 上不存在。

    <input type="checkbox" id="inputSchedule" name="inputCheckboxesSchedule"
           value={this.state.displayMode}
           onClick={e => this.toogleDisplaymode(e.target.value)}/>

Answer 1

第一个警告意味着 HTMLElement 实例上没有 play() 方法。这是有道理的，因为 play() 可能是您在自己的组件上定义的方法。

第二个警告表示EventTarget实例中没有value属性。有关 EventTargets, see MDN.

的更多信息

我不确定如何解决第一个问题，因为您需要获取对您创建的实例的访问权限。但是对于第二个，您很可能只需要转换 return 值。所以，你应该这样做：

{e => this.toogleDisplaymode((e.target as HTMLInputElement).value)}

---

编辑：这可能会解决您的第一个问题。

我不确定，但可能是因为您正在尝试播放媒体元素，如果是这种情况，您需要将 audioPlayer 转换为正确的类型：

let audioPlayer: HTMLMediaElement = document.getElementById(audioId)

See MDN, again, for more information.

Answer 2

晚了 post 但它会帮助其他用户，要解决第一个问题，您可以将 audioPlayer 变量的类型更改为 HtmlVideoElement，如下所示

let audioPlayer: HTMLVideoElement = document.getElementById(audioId);  
audioPlayer.play();  

这肯定会解决问题

Answer 3

在Angular5中你需要按如下方式转换：

let audioPlayer = <HTMLVideoElement> document.getElementById(audioId);

audioPlayer.play();  

Answer 4

在 angular 7 中运行此代码：

let audioPlayer = <HTMLVideoElement>document.getElementById('video');
audioPlayer.muted = true;