使用Web API和angular JS將數據下載為Excel文件

Question

我有一種從Web應用程序下載文件的方案，該應用程序使用a）Angular JS作為前端b）Web api作為服務器，瀏覽器是IE9。

我已經嘗試了很多用於將HTML表轉換為excel，csv的插件，但是它們都不適用於IE9。所以我決定在Web api中生成文件並在客戶端中下載。但是那也不起作用。 有人可以分享這種情況的可行示例嗎？ Angular JS代碼：

var app = angular.module('myApp', []);
    app.controller('myCtrl', function ($scope, exportToExcelService) {
        $scope.export = function () {
            exportToExcelService.download().success(
                function (response) {

                })
                 .error(function (response, status) {

                 });
        }
    }).

factory('exportToExcelService', function ($http) {
    var sampleAPI = {};
    sampleAPI.download = function () {
        return $http({
            method: 'POST',
            url: 'api/Sample/download'          
        });
    }
    return sampleAPI;
});

Web APi控制器代碼：

[HttpPost]
        public HttpResponseMessage download()
        {
            List<Record> obj = new List<Record>();
            obj = RecordInfo();
            StringBuilder str = new StringBuilder();
            str.Append("<table border=`" + "1px" + "`b>");
            str.Append("<tr>");
            str.Append("<td><b><font face=Arial Narrow size=3>FName</font></b></td>");
            str.Append("<td><b><font face=Arial Narrow size=3>LName</font></b></td>");
            str.Append("<td><b><font face=Arial Narrow size=3>Address</font></b></td>");
            str.Append("</tr>");
            foreach (Record val in obj)
            {
                str.Append("<tr>");
                str.Append("<td><font face=Arial Narrow size=" + "14px" + ">" + val.FName.ToString() + "</font></td>");
                str.Append("<td><font face=Arial Narrow size=" + "14px" + ">" + val.LName.ToString() + "</font></td>");
                str.Append("<td><font face=Arial Narrow size=" + "14px" + ">" + val.Address.ToString() + "</font></td>");
                str.Append("</tr>");
            }
            str.Append("</table>");
            HttpResponseMessage result = null;
            // serve the file to the client      
            result = Request.CreateResponse(HttpStatusCode.OK);
            byte[] array = Encoding.ASCII.GetBytes(str.ToString());
            MemoryStream mem = new MemoryStream(array);
            result.Content = new StreamContent(mem);
            result.Content.Headers.ContentType = new MediaTypeHeaderValue("application/vnd.ms-excel");
            result.Content.Headers.ContentDisposition = new ContentDispositionHeaderValue("attachment")
            {
                FileName = "Data.xls"
            };
            return result;
        }

        public List<Record> RecordInfo()
        {

            List<Record> recordobj = new List<Record>();
            recordobj.Add(new Record { FName = "Smith", LName = "Singh", Address = "Knpur" });
            recordobj.Add(new Record { FName = "John", LName = "Kumar", Address = "Lucknow" });
            recordobj.Add(new Record { FName = "Vikram", LName = "Kapoor", Address = "Delhi" });
            recordobj.Add(new Record { FName = "Tanya", LName = "Shrma", Address = "Banaras" });
            recordobj.Add(new Record { FName = "Malini", LName = "Ahuja", Address = "Gujrat" });
            recordobj.Add(new Record { FName = "Varun", LName = "Katiyar", Address = "Rajasthan" });
            recordobj.Add(new Record { FName = "Arun  ", LName = "Singh", Address = "Jaipur" });
            recordobj.Add(new Record { FName = "Ram", LName = "Kapoor", Address = "Panjab" });
            return recordobj;
        }

Answer 1

我通過使用以下代碼找到了解決方案，它的工作原理就像一個魅力。我們只需要添加window.location.href。

app.controller('myCtrl', function ($scope, exportToExcelService,$location) {
    $scope.export = function () {
        exportToExcelService.download().success(
            function (response) {                
               window.location.href = 'api/sample/download'
            })
             .error(function (response, status) {
                 var str = 'Hello'
             });
    }
}).