如果 firestore 中存在 "video" 字段，如何显示视频模板？

Question

您好，我正在尝试使用 模板文字 显示视频，一切正常，但现在我想隐藏模板，如果firestore 中的 video 字段为空或不存在

如果字段 video 在 firestore 中具有嵌入值，则视频会正确显示

但是如果 video 字段没有任何值，那么 iframe 标签仍然显示，我想隐藏它

这是我的代码



const video  = document.getElementById('video');
let path3 = `Ludolab/offer/list/${idRef}/index/${idCon}/content`;
let collRef3 = db.collection(path3);
collRef3.onSnapshot((querySnapshot) => {
  video.innerHTML = '';
  querySnapshot.forEach((doc) => {
    video.innerHTML +=`  
    <iframe class="has-ratio" width="150" height="150" src="https://www.youtube.com/embed/${doc.data().video}" 
            frameborder="0" allowfullscreen> 
    </iframe>
                         
        `
  });
});

非常感谢任何帮助，在此先感谢。

Answer 1

您可以添加一个简单的 if 语句，仅当存在视频字段时才添加另一个 iframe：

collRef3.onSnapshot((querySnapshot) => {
  video.innerHTML = '';
  querySnapshot.forEach((doc) => {
    if (doc.data().video) {
      // video field present, add iframe
      video.innerHTML += `  
    <iframe class="has-ratio" width="150" height="150" src="https://www.youtube.com/embed/${doc.data().video}" 
            frameborder="0" allowfullscreen> 
    </iframe>`
    }
  });
});

如果 firestore 中存在 "video" 字段，如何显示视频模板？

How to display a video template if a "video" field exists in firestore?

html

javascript

jquery

google-cloud-firestore