How to run function in AngularJS controller on document ready?

Question

I have a function within my angular controller, I'd like this function to be run on document ready but I noticed that angular runs it as the dom is created.

function myController($scope) { 

      $scope.init = function() { 

          // I'd like to run this on document ready 

      } 

      $scope.init(); 

// doesn't work, loads my init before the page has completely loaded 

}

Does anyone know how I can go about this?

Answer 1

For running function in AngularJS controller on document ready you can use the angular.element(document).ready() method to attach callbacks for when the document is ready. 

Are you interested in learning Angularjs from the basics! Here's the right video for you on Angularjs provided by Intellipaat:

You can simply attach the callback in the controller as follows:-

angular.module('MyApp', []) 

  .controller('MyCtrl', [function() { 

        angular.element(document).ready(function () { 

            document.getElementById('msg').innerHTML = 'Hello'; 

        }); 

}]);