Monday, February 4, 2013

AngularJS binding window resize event


(You might like a related example about window resize event for AngularJS, here: http://ngtutorial.com/tutorial/07_style-class-fluid-design-angularjs.html)


On my chromium browser, my handler for a resize event is called 4 times.
So, doing the following prevents your handler from being called multiple times if the window size is the same.

//------------------------

var MyApp = angular.module('MyApp', ['widget.merchant.wall']);
MyApp.run(function($rootScope, $window){
$rootScope.windowWidth = $window.outerWidth;
angular.element($window).bind('resize',function(){
$rootScope.windowWidth = $window.outerWidth;
$rootScope.$apply('windowWidth');
});
})


function FeaturedCtrl($scope, $rootScope) {
$rootScope.$watch('windowWidth',function(newVal, oldVal){

})
}