javascript - 如何区分 Firebase 上存储的文本和 ImageUrl？

Question

我将文本和 ImageUrl 存储在 firebase 上的数组中。然后，我的代码应该随机获取数据之一(文本和 imageUrl)。它实际上是将文本作为数据来处理。但我还需要添加图像 url(图像存储在 Uploadcare 上)。代码需要读取数据，如果它是图像 url ( https://... 。)，则必须显示图像。我需要编写一个“if”条件，但我的问题更多是如何在 html 部分中管理它。根据结果​​(imageurl 或文本)必须使用

或 .

private getRandom() {
    let rand1 = Math.floor(Math.random() * this.cat1.words.length);


    let wordCat1 = this.cat1.words[rand1];

    var re = /https/gi; 
    if (wordCat1.search(re) == -1 ) { 
      console.log("Data 1 does not contain Image URL" ); 
    } else { 
      console.log("Data 1 contains ImageUrl" ); 
    } 

    return [wordCat1];
}

Answer 1

我相信您可以通过使用 bool 变量并在 HTML 文件中使用 Angular 的 *ngIf 来实现此目的。

XYZ.ts 文件 =>

isImageURL: boolean

private getRandom() {
    let rand1 = Math.floor(Math.random() * this.cat1.words.length);


    let wordCat1 = this.cat1.words[rand1];

    var re = /https/gi; 
    if (wordCat1.search(re) == -1 ) { 
      console.log("Data 1 does not contain Image URL" ); 
      isImageURL = false;
    } else { 
      console.log("Data 1 contains ImageUrl" ); 
      isImageURL = true;
    } 

    return [wordCat1];
}

现在，您有了 bool 值，您可以在 HTML 中使用它并填充您想要填充的任何数据

XYZ.html =>

<!-- This div checks if the URL is true or false and populates data for true value only -->
<div *ngIf='isImageURL'>
   <!-- Your content -->
<div>

<!-- This div checks if the URL is true or false and populates data for false value only -->
<div *ngIf='!isImageURL'>
   <!-- Your content -->
<div>

我确信这就是你想要的。如果您还想在评论中了解其他内容，请告诉我。谢谢:)