title: Angular - Display byte array as image
body: <p>I have an api that returns a byte[], i want to display it as an image in my front application, so i used data url to display the image </p>
  
  <pre><code>this.cardBackgroundService.getImage(event.data.entitlementCertificateNumber, "C003").subscribe(data =&gt; {
    this.image = data;
    console.log(this.image);
  });
  
  &lt;img src="data:image/png;base64,{{image}}"/&gt;
  </code></pre>
  
  <p>the problem is when i display the response of the api in the console, it has this format and it doesn't display as an image</p>
  
  <blockquote>
    <p>�PNG 
    �Ou���j�000000000H��a<code>��a````````��a</code>��a<code>��a```````��a</code>��a<code>��a````````��a</code>��a<code>��a```````��a</code>��a````````�.r�<em>��</em>��X��V��QS��\�ۂ���F�`�{lhXnJU��s��iiǯ�O1�;������</p>
  </blockquote>