Don P
Don P

Reputation: 63567

Execute a function when Angular is finished rendering a controller's template

How can I execute a function after Angular has finished rendering my template for a controller?

Here is an example of the function I am trying to run. Since the view hasn't finished rendering, there are no elements matched by $('.my-element').

function myFunction(){
  $('.my-element').css('color', 'red');
}

Upvotes: 1

Views: 2529

Answers (1)

Satyam Koyani
Satyam Koyani

Reputation: 4274

You can simply listen this event if you are using ng-view.ngView-viewContentLoaded here you can get more idea about this event.

 $scope.$on('$viewContentLoaded', function(){
    //Here your view content is fully loaded !!
    //Here you can write your custom logic which will execute after content loaded.      
     $('.my-element').css('color', 'red');
  });

Register this event in your parent controller.document clearly stated

Emitted every time the ngView content is reloaded.

See demo

Upvotes: 4

Related Questions