Angular Directive for Window Resize Event

angular-resize.js

angular.module('your-module-name', [])
    .directive('onResize', ['$window', function ($window) {
        return {
            link: function (scope, el, attrs) {
                var initialWidth = $window.innerWidth,
                    smallClass   = attrs.resizeClass || 'yourDefault',
                    smallAttr    = attrs.resizeAttr  || 'yourDefault',
                    smallWidth   = attrs.resizeWidth || 1024;
    
                var setSmall = function () {
                    el.addClass(smallClass);
                    el.attr(smallAttr, smallAttr);
                };
    
                var setLarge = function () {
                    el.removeClass(smallClass);
                    el.removeAttr(smallAttr);
                };
    
                if (initialWidth < smallWidth) {
                    setSmall();
                } else {
                    setLarge();
                }
    
                angular.element($window).on('resize', function () {
                    if ($window.innerWidth <= smallWidth) {
                        setSmall();
                    } else {
                        setLarge();
                    }
                });
            }
        };
    }]);