angularjs - Angular templating and routing with jquery -

i'm working on first angular website templating , routing.

i want image size of window - 70px

//jquery (this part works fine alone, tested it.)

    //dynamically assign height function resize() {   var windowheight = $(window).height() - 70;      $('.home .image img').height(windowheight); }  //initial load of page $( window ).ready(resize);  //every resize of window $(window).resize(resize); 

my problem when load home.html(where picture , act frontpage) index.html doesn't apply style windowheight image, if manually resize window bit, style applies.

i tried inserting script directly home.html , works prefer have jquery separate in .js file

my guess script doesn't registrer home.html has been loaded index.html until resize has been triggered.

note: stylesheets , scripts loaded in index.html head, , pages loaded index.html ng-view looks @ moment

<div class="image"><img src="images/56.jpg"></div> 

sorry bad explanation, i'm new angular don't understand yet.

thank you.

i guess there 2 options, can trigger this:

on state change success

$scope.$on('$routechangesuccess', function () {     // run resize function }); 

or on view rendered callback

$scope.$on('$viewcontentloaded', function() {     // run resize function }); 

hope helps.