current community

your communities

more stack exchange communities

Stack Exchange
tour help
careers 2.0
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite

Background Scenario:

I have an ng-repeat that populates my view, dynamically enlarging the <div> container.

I need to adjust the height of my <div> when the rendering is complete, and I also need to do that on every other page of my app.

I'm well aware of the ready() function:

    angular.element(document).ready(function() {
        console.log('ready')
    })

But this code, put in app.js get executed only on the first page opening (or reloading).

Important note:
I'm using ui.router to navigate through my "pages", so I call an `$state.transitionTo()' whenever I need to change page.

Question: Is there an Angular event that gets broadcasted whenever the page has fully rendered?

share|improve this question
add comment

1 Answer

up vote 1 down vote accepted

While looking for a solution, I've found that there is an ui.router event that gets called whenever the DOM has been fully rendered (on each new state transition)

The event is $viewContentLoaded and the syntax is pretty straight forward:

    $rootScope.$on('$viewContentLoaded', function (event) {
            console.log('lock & loaded')
    })


I thought that could be useful to someone else,
Cheers

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.