AngularJS: How to show preload or loading until page is loaded completely?

Question

I\'ve an image gallery site where I\'m getting all images and image related data from the database as json format in my controller and then by using ng-repeat I\'m binding them

Answer 1

# UPDATE [August 2017]

Same answer as below except we could work with the load event on window instead of DOMContentLoaded on document. This will ensure that all assets (such as images) in the window are loaded.

window.addEventListener("load", function(event) {
    ...
})

---

We don't have to force Angular where vanilla javascript can suffice. This is how it worked for my AngularJS project

Added this to the body tag. It will be removed with a script tag once HTML Content Loads

script tag right under the image.

DOMContentLoaded event will ensure that the the callback is executed when all the images,fonts,js and other assets have been loaded.

Good Luck.