如何在Angular中使用ng-click从服务器下载文件？

Question

我有一个下载文件到本地系统的Action。文件可以是jpeg、pdf或word格式。

现在当我在ASP.Net中运行此Action时，文件会被下载。但是当我在按钮的ng-click事件中调用此Action时，既没有任何错误提示，也没有文件被下载。

代码片段：

$scope.downloadFile = function () {
    debugger;
    $http(
        {
            url: '/ControllerName/DownloadFile',
            method: 'POST',
            data: {},
            responseType: 'arraybuffer' ,
        })
    .success(function (data, status) {
        if (status == 200) {
            var file = new Blob([data], { type: 'Application/msword' });
            saveAs(file, 'test.docx');
            alert('File downloaded');

        }
    })
    .error(function () {
        alert("Error");
    })
}

在这种情况下，很明显我会遇到一个“saveAs未定义”的错误。因此，我包含了filesaver.js文件。

现在我不确定如何将fileSaver依赖项包含到我的控制器中。因为如果我只是按照以下方式进行包含：

app.module('myApp',['fileSaver']);

我再次遇到了错误。

如何消除这个错误，或者是否有其他方法可以下载文件？

注意：文件可以是jpeg、word、pdf、zip格式，我正在使用按钮标签。

- Kgn-web

---

FileSaver不是一个Angular模块，因此您不需要注入该依赖项。您只需要在HTML中的script标签中包含filesaver.min.js文件，就可以正常工作了。 - David Rego

@DavidRego 是的，你说得对。 - Kgn-web

Answer 1

Angular File Saver 已经发布。请查看，希望能对您有所帮助。

- Sariban D'Cl

Answer 2

这里不需要注入任何Angular依赖，只需直接在您的项目中包含该文件即可正常工作

您可以包含此JS文件进行下载

https://github.com/eligrey/FileSaver.js/blob/master/FileSaver.js

app.js

app.module('myApp',[]);

从app.js中移除fileSaver

- Jenson Raby