Call AngularJS function on document ready

Question

Is there a way to call an Angular function from a JavaScript function?

function AngularCtrl($scope) {   $scope.setUserName = function(student){       $scope.user_name = 'John';   } } 

I need the following functionality in my HTML:

jQuery(document).ready(function(){   AngularCtrl.setUserName(); } 

The problem here is my HTML code is present when page is loaded and hence the ng directives in the html are not compiled. So I would like to $compile(jQuery("PopupID")); when the DOM is loaded.

Is there a way to call a Angular function on document ready?

Answer 1

Angular has its own function to test on document ready. You could do a manual bootstrap and then set the username:

angular.element(document).ready(function () {     var $injector = angular.bootstrap(document, ['myApp']);     var $controller = $injector.get('$controller');     var AngularCtrl = $controller('AngularCtrl');     AngularCtrl.setUserName(); }); 

For this to work you need to remove the ng-app directive from the html.