AngularJS | Browser resize function with AngularJS

I used to write some function for small resolution screen using screen width condition. But function was executing when load the page and when resize and refresh the screen.

Here, I got the solution that we can fix using AngularJS browser's window object.

First, We have to create controller and add $window service to controller

function controllerName($scope, $window) {
      // add your code here
}

With the $window service and the Angular element, you can get a reference to the JQuery object:

var appWindow = angular.element($window);

You can use bind() on resize. bind() function will execute the whenever the browser resizes.

appWindow.bind('resize', function () {
	console.log('resize');
});

Demo

shanidkv's picture