使用模板文字附加 HTMLVideoElement 对象

问题描述

我将一个视频元素附加到一个 div。我想通过将视频元素包装在 html 模板中来做到这一点。但是,视频元素不会显示,而是显示[object HTMLVideoElement]。但是如果我只附加视频元素,它会显示视频流。我需要一个解决方法才能在附加之前将 html 模板附加到视频。

enter image description here

带模板字符串(不显示视频)

const addStream = (video,stream) => {
  video.srcObject = stream;
  video.addEventListener("loadedMetadata",() => {
    video.play();
  });

  $(videoFrame).append(`
  <div class="col-lg-6 mb-3">
  <div class="card card-custom gutter-b">
    <div class="card-body">
      <div
        class="d-flex justify-content-between flex-column h-100"
      >
       
        <div class="h-100">
       
          <div class="d-flex flex-column flex-center">
       
            <div
              class="embed-responsive embed-responsive-16by9"
            >
          ${video}
            </div>
       
       
            <a
              href="javascript:void(0)"
              class="card-title font-weight-bolder text-dark-75 text-hover-primary font-size-h4 m-0 pt-7 pb-1"
              >New User</a
            >
       
       
            <div
              class="font-weight-bold text-dark-50 font-size-sm pb-7"
            >
              User address
            </div>
           
          </div>
          
        </div>
       
      </div>
    </div>
  </div>
</div>  
  `);
};

无模板字符串(显示视频流)

const addStream = (video,() => {
    video.play();
  });

  $(videoFrame).append(video);
};

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)