AngularJS -显示加载图标，直到csv文件下载

AngularJS - show loading icon till csv file is downloaded

本文关键字：直到 csv 文件下载 图标 显示 加载 AngularJS      更新时间：2023-09-26

我有AngularJS应用程序，我发送到服务器上下载svc文件，像这样:

public static void DownloadCSV(string csvFile, string fileName)
    {
        HttpContext.Current.Response.AppendHeader("Content-Disposition",
             "attachment; " +
             "filename=" + fileName + ".csv;" +
             "creation-date=" + DateTime.Now.ToString() + "; " +
             "modification-date=" + DateTime.Now.ToString() + "; " +
             "read-date=" + DateTime.Now.ToString());
        HttpContext.Current.Response.ContentType = "text/csv";
        HttpContext.Current.Response.Write(csvFile);
        HttpContext.Current.Response.End();
    }
在客户端，我将

发送给一个名为"exportToCsv"的webApi函数，该函数使用DownloadCSV函数，如下所示:

            var p = document.createElement('a')
            p.setAttribute('href', "myApp/exportToCsv" )
            p.click();

我的问题是，我想向用户显示一个加载图标，直到文件完成下载。

我该怎么做呢?

准备一个加载图标(.gif可能)的html，它位于屏幕的中心，其余的可能是阴影;

<div ng-show="loading" ng-include src="'loading.html'" ></div>

在JS端，在开始下载之前，将加载设置为true，完成后将其设置为false

$scope.loading = false; // when starts
$scope.loading = false; // when finished
相关文章：