One part of my app loads remote images via a fairly standard img tag. Because these images can take a few moments to load owing to various processing required on the server, I’d like to show a spinner until the image has fully loaded.
I know how to do this when using $http calls and such, but I’m not sure how I’d do this with a regular old img tag. Can anyone shed some light?
You can use the HTML 5 media events to achieve this.
Thanks for the quick response. Looks like that’s what I’m after, however I also found an answer here: http://stackoverflow.com/questions/17884399/image-loaded-event-in-for-ng-src-in-angularjs
Essentially I’d create a custom directive that would do much the same thing (bind to the load event). That way I can start my spinner when my controller loads (as this controller deals with showing one remote image at a time) then cancel it with a $scope event when the image has fully loaded.
But those media events will definitely come in handy for something else I’m planning. Cheers!