属性 'scr' 在 mediaStream 和 Angular 类型 'Element' 上不存在 4

Question

我正在使用 getUserMedia 显示来自网络摄像头的实时流。

我的 app.component.html 是

// to show webcam video
<video id="vid1" autoplay></video>

// to show recieved stream from other user.
<video id="vid2" autoplay></video>

和app.component.ts

navigatorr.getUserMedia(constraints, function (stream) {
    const video = document.querySelector('#vid1');

    // inserting our stream to the video tag
    video.src = window.URL.createObjectURL(stream);

 }

它给出了一个错误

Property 'src' does not exist on type 'Element'.

但是如果我使用

const video = document.querySelector('video');

它正在工作，但是我将如何显示接收到的流的视频。

如何解决这个问题，请高人帮帮我。

Answer 1

试试这个

document.getElementById("vid1").src= window.URL.createObjectURL(stream);

Answer 2

您需要将 Element 转换为 HTMLVideoElement：试试这个：

navigatorr.getUserMedia(constraints, function (stream) {
    const video = <HTMLVideoElement>(document.querySelector('#vid1'));

    // inserting our stream to the video tag
    video.src = window.URL.createObjectURL(stream);

 }

Answer 3

在我的例子中，以下变体有效：

navigator.getUserMedia(constraints, function (stream) {
    const video: HTMLVideoElement = document.querySelector('#vid1');

    // inserting our stream to the video tag
    video.src = window.URL.createObjectURL(stream);

 }

P.S。 navigatorr !== navigator

属性 'scr' 在 mediaStream 和 Angular 类型 'Element' 上不存在 4

Property 'scr' does not exist on type 'Element' in mediaStream and Angular 4

webrtc

mediastream

angular