How to determine when AngularJS has finished rendering all of the components & directives

Question

Is there any way to run scripts when AngularJS has finished rendering all the routes, components & directives?

For example when all components and directives with a templateURL have finished rendering.

Answer 1

If it's for display purpose you can use he ngCloak directive.

According to Angular docs it is used to prevent the Angular html template from being briefly being displayed by the browser in its raw (uncompiled) form while your application is loading. Use this directive to avoid the undesirable flicker effect caused by the html template display.

You can also use $http.pendingRequests.

Answer 2

Please use $timeout service with 0ms delay:

$timeout(function() {
   //this code will be invoked when all directives and components will be rendered
});

Answer 3

$timeout is the best way when you need to execute something after the DOM has finished rendering:

$timeout(function() {

});

http://lorenzmerdian.blogspot.de/2013/03/how-to-handle-dom-updates-in-angularjs.html