web-dev-qa-db-ja.com

Angular

いくつかの製品を含むアプリがあり、各製品には異なる量の画像を含むギャラリーがあります。各画像の名前は完全にランダムで、他の画像名とは相関関係がありません。

各商品画像は/src/assets/images/products/:id/

ギャラリーコンポーネントにパスを追加する必要がありますが、名前がランダムであるため、パスをループできません。 Angularのみを使用してフォルダーから各ファイルをループする方法はありますか?そうでない場合は、ファイルの名前を変更せずにバックエンドでそれを行うことができますか?それが重要な場合は、Node.jsバックエンドでもアプリを実行しています。

4
Simeon Nakov

フロントエンドではそれを行うことはできません。必要なのは、バックエンドとその中のリターンファイルを使用することです。

NodeJをバックエンドとして使用しているため、fs.readdirまたはfs.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 、それはあなたがどのように進むことができるかについてあなたを助けるかもしれません。