title: Getting iframe in Angular 7 web component to refresh in Internet Explorer
body: <p>I've been building an angular app that loads a 'preview' screen containing a second webpage embedded in an iframe. When changes are made in the app, I have a requirement that the iFrame refresh to show the changes. In any browser outside of Internet Explorer, the iFrame will reload without the contents being cached. In IE11, the iframe would load the source from cache. I've tried two method in order to refresh the iframe (from the component containing the iFrame):</p>
  
  <p>Template HTML:</p>
  
  <pre><code>&lt;div&gt;
    &lt;iframe *ngIf="iFrameUrl" id="preview-Iframe" [src]="iFrameUrl" #iframe&gt;&lt;/iframe&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>First try:</p>
  
  <pre><code>this.iframe.nativeElement.location.reload(true); //iframe being a ViewChild ElementRef
  </code></pre>
  
  <p>Second try:</p>
  
  <pre><code>this.iframeSrcUrl = this.iframeSrcUrl; //iframe source changed to same url
  </code></pre>
  
  <p>Also tried:</p>
  
  <pre><code>this.iframeSrcUrl = this.iframeSrcUrl + '&amp;uid=' + Guid.newGuid();
  </code></pre>
  
  <p>Neither of these seem to work. Is this possible? Is there a way I can force the iFrame to ignore cache?</p>