Get onload event of an angular.element iframe

Question

I am trying to get an onload event on an added iframe. This happens inside a service function call. Its supposed to download a file, what works fine. But I need to wait until the iframe is loaded to return a promise resolve. The reduced code with the problem is:

iFrame = angular.element('<iframe id="blaba" style=\'position:fixed;display:none;top:-1px;left:-1px;\'/>')
angular.element(document.body).append iFrame
# onload bind here
iFrame.attr('src', url)

I tried it with

iFrame.onload = ->      
  $log.info 'iframe loaded'

Also

iFrame.on 'load', (event) ->
  $log.info 'iframe loaded'

I also tried to select the Iframe via its id and bind the load event on that. But also doesn't work. Any ideas or suggestions?

best regards

Andriy · Accepted Answer · 2016-10-26 10:36:22Z

1

try

app.controller('MainCtrl', () => {
  var iFrame = angular.element('<iframe id="blaba" height="200"/>')
  angular.element(document.body).append(iFrame);
  // onload bind here
  var url = 'test.txt';
  iFrame.attr('src', url);
  iFrame.on('load', event => console.log('IFRAME LOADED'))
});

plunker: https://plnkr.co/edit/XeaYCmG6L6NG2T1zaCfN?p=preview

answered Oct 26, 2016 at 10:36

Andriy

15.5k4 gold badges49 silver badges53 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Denny Mueller Over a year ago

ohh, well turns out if you download a file via the url the onload event isn't called. plnkr.co/edit/ARwfzRtVc2veUzzxITsV?p=preview

Denny Mueller Over a year ago

Also could find some definite answer to that stackoverflow.com/a/20624274/1202324

Collectives™ on Stack Overflow

Get onload event of an angular.element iframe

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related