Displaying fetched base64 Image in ionViewWillEnter()


#1

Hi !
I am struggling with displaying a Base64 image fetched from backend…
How can I pass a string from ionViewWillEnter method (or ionViewDidLoad) to the HTML in order to display it !?
Thanks in advance

  ionViewWillEnter() {
    this.feathersClient.damageService.get(this.userId, {},
          (error, response) =>
                    {
                      if (error)
                      {
                        console.log("ErrorDamage: " + error);
                      }
                      else
                      {
                        console.log("Damage: " + JSON.stringify(response));
                        let img = JSON.stringify(response.image);
                      };

    });
  }

#2

something like

ts

export class Something {
    
    myImgValue: any; // replace any with the right type

   ionViewWillEnter() {
this.feathersClient.damageService.get(this.userId, {},
      (error, response) =>
                {
                  if (error)
                  {
                    console.log("ErrorDamage: " + error);
                  }
                  else
                  {
                    console.log("Damage: " + JSON.stringify(response));
                    this.myImgValue = JSON.stringify(response.image); // not sure that the stringify is actually needed or not
                  };

});

}

html

 <div *ngIf="myImgValue != null"> <!-- Not sure that is or not actually needed -->
    <img [src]="myImgValue">
 </div>

#3

Thank you Richards,
Saved my day :smiley:


#4

Cool, good to hear it helped!


#5

Yes, just removed the stringify method.