AngularJS fill-height directive: sets an element's height so it fills up the remaining space in the viewport

fillHeight.js

angular.module('app').directive('fillHeight', [
    '$window',
    function ($window) {
        return {
            restrict: 'A',
            link: function (scope, e) {
                var initialHeight = e[0].offsetHeight;

                var fill = function () {
                    angular.element(e).css('height', Math.max(initialHeight, $window.innerHeight - e[0].offsetTop) + 'px');
                };

                scope.$watch(function () {
                    return e[0].offsetTop;
                }, function () {
                    fill();
                });

                angular.element($window).bind('resize', function () {
                    fill();
                });
            }
        };
    }
]);