Display photos using Firebase

I’m trying to create an Ionic 2 application with Firebase as my database.
I have a .json file as my databas, looks like this:
{
“product”:[
{
“name”: “item1”,
“description”: “item desc”,
“price”: “1”,
“image”: “null”
}
]
}

How can I take an image from the Firebase storage and add it to this product?

Follow the Firebase Storage getting started guide. Get a download URL for the photo by querying for it, and set that URL as the source of your image in the DOM.

1 Like

How can I do that? I started but got problems. I have 3 different images in the storage and I want each one to be in each card I have. How can I do that? I got the location of course. but what next? Sorry for dumb questions, I’m just starting with this and still got problems with it.

Different people are going to have different approaches. I’ll tell you mine. (This is a bit modified to fit your situation.) In my database service, my “upload photo” method returns a Promise where the string is the downloadURL. So the upload command uploads the photo, then calls a private method that obtains the download URL generated from the upload. Once the Promise returns, I store it the downloadURLlocally, and I also store it in the realtime database as part of the user profile, for example.

Edit: do you mean how to display the photo? <img [src]="downloadURLvariable" />