使用Angular循环浏览文件夹中的所有文件/图像

时间:2018-03-23 08:56:10

标签: javascript node.js angular typescript static-files

我有一个带有一些产品的应用程序,每个产品都有一个包含不同数量图像的图库。每个图像的名称与其他图像名称完全随机/无关。

每个产品图片都在/src/assets/images/products/:id/

我需要将路径添加到图库组件,但我无法遍历它们,因为名称是随机的。有没有办法只使用Angular循环文件夹中的每个文件?如果没有,我可以在后端进行,而无需重命名文件?如果重要的话,我也在Node.js后端运行应用程序。

1 个答案:

答案 0 :(得分:6)

你不能用前端做到这一点。 您需要使用后端和返回文件。

您使用NodeJ作为后端,因此可以使用fs.readdirfs.readdirSync方法。

<强> fs.readdir

const testFolder = './images/';
const fs = require('fs');

fs.readdir(testFolder, (err, files) => {
  files.forEach(file => {
    console.log(file); // use those file and return it as a REST API
  });
})

<强> fs.readdirSync

const testFolder = './images/';
const fs = require('fs');

fs.readdirSync(testFolder).forEach(file => {
  console.log(file);
})

阅读完整的documenation,它可以帮助您了解如何继续。