禁用下载按钮，直到文件下载完成（AngularJS 1.4）

Question

在AngularJS 1.4应用程序中，我们需要禁用下载按钮，直到文件下载完成并在之后启用它。理想情况下它应该在IE 7中工作：）

页

<button ng-click="downloadFile()"
                            ng-class="inProgressDownloadFile ? 'btn-disabled' : 'btn-enabled'">
                        <img ng-show="inProgressDownloadFile" src="imgs/ajax-loader.gif"/>
                        <span>Download</span>
                    </button>

控制器

$scope.downloadFile = function() {
if ($scope.inProgressDownloadFile) {
                return;
            }
$scope.inProgressDownloadFile = true;
FileService.downloadFileById($scope.fileId).then(function(response) {
var blob = new Blob([response.data], {type: "application/vnd.ms-excel.sheet.macroEnabled.12"});
var url = window.URL || window.webkitURL;

                    var downloadLink = angular.element('<a></a>');
                    downloadLink.attr('href',url.createObjectURL(blob));
                    downloadLink.attr('target','_self');
                    downloadLink.attr('download', 'invoice.xlsm');
                    downloadLink[0].click();
}
$scope.inProgressDownloadExcel = false;
               }, function(response) {
                    $scope.inProgressDownloadExcel = false;
               });
console.log('End of method downloadFile().');
        };

服务

factory.downloadFileById = function(fileId) {
            var httpConfig = {
                 responseType: 'arraybuffer',
                 headers: {
                        'Content-type': 'application/json',
                         'Accept': 'application/vnd.ms-excel.sheet.macroEnabled.12'
                     }
            };

            return $http.get(restAppBaseContext + 'restFile/?id=' + fileId, null, httpConfig);
        };

问题

文件已下载但已损坏！当我打开下载的excel文件时，我收到弹出消息：“我们发现invoice.xlsm中的某些内容存在问题。您是否希望我们尝试尽可能多地恢复？......”。如果我单击“是”，我会收到另一条弹出消息：“Excel无法打开文件invoice.xlsm，因为文件格式或文件扩展名无效。...”。

Answer 1

你可以使用

  

NG-禁用

<button ng-click="downloadFile()"
                        ng-disabled="downloaded">
                    <img ng-show="inProgressDownloadFile" src="imgs/ajax-loader.gif"/>
                    <span>Download</span>
                </button>

使用$scope.downloaded作为默认true，直到下载完成。

如需更多参考，请转至HERE