iframe download file angular without jquery

gistfile1.txt

  .directive('fileDownload', function ($compile) {
    var fd = {
        restrict: 'A',
        link: function (scope, iElement, iAttrs) {
            scope.$on("downloadFile", function (e, url) {
                // console.log('dl url-', url);
                var iFrame = iElement.find("iframe");
                if (!(iFrame && iFrame.length > 0)) {
                    iFrame = angular.element("<iframe style='position:fixed;display:none;top:-1px;left:-1px;'/>");
                    iElement.append(iFrame);
                }
                iFrame.attr("src", url);
            });
        }
    };
    return fd;
  });

Wondering why you need to inject $compile service into the directive, even though it was not used anywhere??

I'm using the same code, I have an issue when I want to download multiple files than previous download service call is getting canceled. I want same multiple downloaded. Did you face this issue

Code usage

then file download directive