# AngularJS - mobile

# mobile resize event detection in an angular context

// put this code in the angular.module('yourApp').run(AppInitFn); with other init stuff
var _widthScreen = angular.element($window).width();
$(window).on('resize', function () {
  if (_widthScreen !== angular.element($window).width()) {
    _widthScreen = angular.element($window).width();
    $rootScope.$broadcast(PJEvents.BODY_RESIZE);
  }
});

1
2
3
4
5
6
7
8

# mobile size

SMALL_SCREEN_MAX_WIDTH: 768
MIDDLE_SCREEN_MAX_WIDTH: 992

// smallResolution === smartphone viewport. > is tablet viewport
$rootScope.isSmallResolution = function () {
  return angular.element($window).width() < vars.SMALL_SCREEN_MAX_WIDTH;
};

1
2
3
4
5
6
7