Show image from Firebase storage by retrieving URL Ionic

I am trying to retrieve an image which is a URL which was generated by the user when they signed up. This image then is used by the user to sign in but I cant get the image to display on the application. Any help would be greatly appreciated and below is my code

My QrCode.ts

declare var require: any;
var img;

  selector: 'page-QRPage',
  templateUrl: 'QRPage.html'
export class QRPagePage {
  constructor(public navCtrl: NavController, public navParams: NavParams, public storage: Storage,private userService: UserService) {
    storage.get('id').then((val) => {

  ionViewDidLoad() {'user_id').then((val) => {
    var storageRef ='/images/'+val);

    storageRef.getDownloadURL().then(function(url) {
    // `url` is the download URL for 'images/stars.jpg'

    // This can be downloaded directly:
    var xhr = new XMLHttpRequest();
    xhr.responseType = 'blob';
    xhr.onload = function(event) {
      var blob = xhr.response;
    };'GET', url);

    // Or inserted into an <img> element:
    this.img = document.getElementById('myimg');
    img.src = url;
  }).catch(function(error) {
    // Handle any errors

Then my html file

        QR Code

  <ion-content padding>
        <img [src]="myimg">

import { NgZone} from ‘@angular/core’;

constructor(public zone: NgZone){}

ionViewDidLoad() {‘user_id’).then((val) => {
var storageRef =’/images/’+val);

storageRef.getDownloadURL().then((url) => {
// `url` is the download URL for 'images/stars.jpg' => {

             this.img_src_string = url;
        // in html <ion-img [src]="img_src_string"><ion-img>


}).catch(function(error) {
// Handle any errors