title: BASE64 to image angular 2
body: <p>I'm trying to show an image get from a remote server with angular 2.</p>
  
  <p>In my component I have an object that is an "university_info" object that is my model.</p>
  
  <pre><code>export class myClass
  {
      university_info : university_info;
  }
  myFunction()
  {
      this.university_info = new university_info(responseFromServer[image])
  }
  
  export class university_info
  {
      imageBase64 : string
      constructor(image : string)
      {
          this.imageBase64 = image
      }
  }
  </code></pre>
  
  <p>All is working fine. I get base64 image but when I try to show it in HTML in this way : </p>
  
  <pre><code>  &lt;img [src]="'data:image/jpg;base64,'+university_info.imageBase64" /&gt;
  </code></pre>
  
  <p>That's is what I get :</p>
  
  <p><a href="https://i.stack.imgur.com/OSlLD.png" rel="noreferrer"><img src="https://i.stack.imgur.com/OSlLD.png" alt="enter image description here"></a></p>
  
  <p><a href="https://i.stack.imgur.com/WHz5V.png" rel="noreferrer"><img src="https://i.stack.imgur.com/WHz5V.png" alt="enter image description here"></a></p>
  
  <p><a href="https://i.stack.imgur.com/sMqiL.png" rel="noreferrer"><img src="https://i.stack.imgur.com/sMqiL.png" alt="enter image description here"></a></p>