Question

我目前正在使用图库Web应用程序，该应用程序允许您显示非常多的图像缩略图。

我的问题是，当我想将图像列表从服务器部分（NodeJs）发送到前端部分（Angular）时。确实，当我希望能够显示单个图像时，请按照以下步骤操作：

Server.js

app.get('/image', function(req, res) {
  const path = 'node-assets/Test/Image1.jpg'
  const stat = fs.statSync(path)
  const fileSize = stat.size

    const head = {
      'Content-Length': fileSize,
      'Content-Type': 'image/png',
    }
    res.writeHead(200, head)
    fs.createReadStream(path).pipe(res)
  }
})

在这种情况下，我只需要用链接定义图像（它可能很脏，但首先我想使其最简单）。

Image-component.html：

<div class="Block-Image-Taille-Miniature">
   <img class="Image-Taille-Miniature align-items-center" src="http://localhost:3000/image"/>
</div>

我的问题是，是否有一种解决方案可以让我发送一些可以在正面使用的图像？

<div class="col-sm-2.5 ECRAN-RECHERCHE-conteneur-images" *ngFor="let kk of mesImages">
 <a class="ECRAN-RECHERCHE-lien-image">
        <img class="ECRAN-RECHERCHE-miniature-image" [src]="kk.route" (click)="ouvreImageTailleReel(kk.route)"/>
 </a>
</div>

我首先想到了将文件数组发送到common.service，但是Angular将无法解释图像的路径，因为它们不存在于资源文件夹中。

从后到前发射多个图像

0 个答案: