AngularJS - Vertical Centering

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.13/angular.js"></script>
<div ng-app="MyApp">
    <div class="outer" size-height>
        <div class="inner" center-vertical>Hello, werld.</div>
    </div>
</div>

CSS

div.outer {
    border: 1px solid #ff0000;
}
div.inner {
    border: 1px solid #00ff00;
}

JavaScript

angular.module('ui.filters', []);
angular.module('ui.directives', []);
angular.module('ui', [
    'ui.filters',
    'ui.directives']).value('ui.config', {});

angular.module('ui.directives', []).directive('sizeHeight', ['$window', function ($window) {
    return {
        restrict: 'AC',
        link: function (scope, element) {
            var w = angular.element($window);
            scope.$watch(function () {
                return {
                    'h': w.height(),
                        'w': w.width()
                };
            }, function (newValue, oldValue) {
                element.css({
                    'min-height': (newValue.h * 0.5) + 'px'
                });
            }, true);
            w.bind('resize', function () {
                scope.$apply();
            });
        }
    };
}]);

angular.module('ui.directives', []).directive('centerVertical', ['$window', function ($window) {
    return {
        restrict: 'AC',
        link: function (scope, element) {
            scope.$watch('data.overlaytype', function () {
                $window.setTimeout(function () {
                    console.log('Self:   ' + element.width() + 'x' + element.height());
                    console.log('Parent: ' + element.parent().width() + 'x' + element.parent().height());
                }, 1);
            });
        }
    };
}]);

angular.module('MyApp', ['ui.directives']);