iframe events when finish load it run twice when first access the iframe's page and when finish loading, with angular2+ ,

Question

How can I detect an iframe finish event in angular4 mainly (angular 2+) ? I just have normal iframe like this:

<iframe [src]="..." onLoad=""></iframe>

i faced a problem that when i enter the page that include the iframe the onlaod function run directly (the src is not availbale) and it runs again when the src become available .

Possible duplicate of [Detecting when Iframe content has loaded (Cross browser)](https://stackoverflow.com/questions/751435/detecting-when-iframe-content-has-loaded-cross-browser) — Travis Heeter, Oct 01 '18 at 13:41

score 2 · Answer 1 · answered Oct 01 '18 at 13:47

i make a condition on onload if(this.src) because i faced problem when i access the page that have the iframe onload run directly when src not available, and re run again when iframe loaded when src is available. I removed the loader when iframe is fully loaded . so this is my solution:

<ion-spinner id="loader"  color="primary"></ion-spinner>
<iframe [src]="url"
        onload="if(this.src) document.getElementById('loader').style.display = 'none'"></iframe>

thank you. hope it help someone

iframe events when finish load it run twice when first access the iframe's page and when finish loading, with angular2+ ,

1 Answers1