Not able to display PDF on IE11
<p><strong>Requirement</strong>: </p>

<p>Get the pdf in the form of arrayBuffer from the server, and display the pdf with in the angular app as an overlay.</p>

<p><strong>Approach</strong>:</p>

<p>I am getting the pdf file as arrayBuffer from the service. I am  creating a blob out of it by using </p>

<pre><code>let file = new Blob([data.data], {type: 'application/pdf'});
</code></pre>

<p>Now I am creating the object Url by using</p>

<pre><code>let fileURL = URL.createObjectURL(file);
</code></pre>

<p>assigned this url to the scope, so that it will become available to the template</p>

<pre><code>this.pdf.url = this.$sce.trustAsResourceUrl(fileURL);
</code></pre>

<p>In the template I added an iFrame</p>

<pre><code>&lt;iframe ng-src="{{brief.pdf.url}}" style="width:100%;height:600px;" frameborder="0" scrolling="no"&gt;
    &lt;p&gt;It appears your web browser doesn't support iframes.&lt;/p&gt;
&lt;/iframe&gt;
</code></pre>

<p>This works fine in Chrome and FF but doesn't work in IE11
In Chrome and FF the blob url formed is </p>

<blockquote>
  <p>blob:http%3A//localhost%3A81/0dceebf5-9d38-4366-8f65-ad12616533b4</p>
</blockquote>

<p>but in IE11 the url formed is</p>

<blockquote>
  <p>blob:0dceebf5-9d38-4366-8f65-ad12616533b4</p>
</blockquote>

<p>How to fix this issue?</p>