Edit in JSFiddle

var myApp = angular.module('myApp', []);

myApp.directive('fluidvids', function () {
    return {
        restrict: 'EA',
        replace: true,
        transclude: true,
        scope: {
            video: '@'
        },
        template: '<div class="fluidvids">' +
                    '<iframe ng-src="{{ video }}"></iframe>' +
                  '</div>',
        link: function (scope, element, attrs) {
            var ratio = (attrs.height / attrs.width) * 100;
            element[0].style.paddingTop = ratio + '%';
        }
    };
});

<div ng-app="myApp">
    <fluidvids video="//player.vimeo.com/video/23919731" height="281" width="500"></fluidvids>
    <fluidvids video="http://www.youtube.com/embed/JMl8cQjBfqk" width="560" height="315"></fluidvids>
</div>