How to display all images (files) in Baqend?

Question

I'm building an app using Ionic 3 with Baqend. I know how to get the list of all images inside a folder using:

let folder;
folder = new this.db.File('/file/www/event_0001/');
this.db.File.listFiles(folder).then(function(files) {
    console.log(files);
});

I don't want to keep a reference of each image inside my database since I'm uploading manually through Baqend console. So how can I iterate through the folder, extract the url of each image, and display them using <img src=.../> ?

Answer 1

You can use the file.url method to generate an URL:

let folder;
folder = new this.db.File('/file/www/event_0001/');
this.db.File.listFiles(folder).then(function(files) {
    this.images = files.map(file => file.url); 
});

Afterwards you can use ngFor to display the images:

<div *ngFor="let image of images">  
   <img [src]="image">
</div>  

and you must set the query permission on the folder correctly for listFiles to work. For example to public or a group/user who should be allowed to do this.