$scope.getExcel = function () {
$http.post("/production/statistics/export", {
storeId: $scope.$parent.currStore.storeId,
date: $scope.$parent.ledgerDate.getTime()
}, {responseType: "blob"}).success(function (data) {
var blob = new Blob([data], {type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"});
var fileName = $scope.$parent.currStore.name + "_生产统计_" + $scope.$parent.ledgerDate.Format("yyyy-MM-dd");
var a = document.createElement("a");
document.body.appendChild(a);
a.download = fileName;
a.href = URL.createObjectURL(blob);
a.click();
})
}

并且服务端返回的是二进制数据流.

客户端接收后转换为指定文件格式的blob,最后创建blob对象的URL 把它放在A标签的href上 就会自动下载了

或者

 $http.post($rootScope.restful_api.last_output_excel,body_data,{responseType: 'arraybuffer'}).success(function(data){
var blob = new Blob([data], {type: "application/vnd.ms-excel"});
var objectUrl = URL.createObjectURL(blob);
var aForExcel = $("<a><span class='forExcel'>下载excel</span></a>").attr("href",objectUrl);
$("body").append(aForExcel);
$(".forExcel").click();
aForExcel.remove();
})

经验总结:

1.post的方法里要加responseType: 'arraybuffer'参数,不然下载的excel会乱码(这点一开始没注意到,费力好久)

2.使用{type: "application/vnd.ms-excel"}的写法,可以保存为xls格式的excel文件(兼容老版本)。而使用“application/vnd.openxmlformats-officedocument.spreadsheetml.sheet”则会保存为xlsx

3.使用增加节点调用click方法,而不使用帖子中的window.open(objectUrl)方法,是防止被浏览器当插件屏蔽弹出连接

另外也可以分为两步来做,一是异步请求判断下载是否存在,二是再次调用在后端通过response下载文件。

angularJS实现无刷新文件下载的更多相关文章

  1. Javascrpt无刷新文件上传

    最近工作中遇到上传文件问题,主要需求是一步点击上传,兼容ie8+,当时用的dojox/form/uploader控件,这两天扒了一下源码,明白了原理拿出来分享一下. 总体思路如下: 1.对于支持XML ...

  2. jquery+ajax(用ajax.dll)实现无刷新分页

    利用ajax.dll那种方式的无刷新,在这就不说了,新朋友可以看下我的另一片文件http://www.cnblogs.com/dachuang/p/3654632.html 首先,这里用的是jquer ...

  3. Ajax下载文件(页面无刷新)

    说明:Ajax是无法实现文件传输的,本文只是模拟了Ajax不刷新页面就可以请求并返回数据的效果.实质上还是通过提交form表单来返回文件流的输出. 分步实现逻辑: ajax请求服务器,访问数据库,根据 ...

  4. 利用Content-disposition实现无刷新下载图片文件

    今天在使用 tinypng.com 这个在线压缩图片的网站时,对其处理完图片后,可以无刷新下载图片感到好奇,于是了解了一下相关实现.无刷新下载可以利用MIME type或者设置Content-disp ...

  5. MvcPager.dll使用实现无刷新分页以及MvcPager的Nuget程序包实现刷新分页

    无刷新分页: 1.引入JQuery的NuGet程序包 2.引入程序包 3.引入MvcPager.dll  ,MvcPager.dll文件下载链接http://pan.baidu.com/s/1hsvB ...

  6. nodejs利用ajax实现网页无刷新上传图片

    nodejs利用ajax实现网页无刷新上传图片 标签(空格分隔): nodejs 通常情况下上传图片是要通过提交form表单来实现的,但是这又不可避免的产生了网页转. 利用ajax技术和FormDat ...

  7. 在Thinkphp中使用AJAX实现无刷新分页

    在Thinkphp目录的Lib\ORG\Util\目录里新建AjaxPage.class.php,写入一下内容: <?php // +------------------------------ ...

  8. 页面无刷新Upload File

    页面无刷新Upload File. 利用jquery.form.js的ajaxForm提交文件. 具体参考以下代码: 前台html <%@ Page Language="C#" ...

  9. JQuery实现无刷新下拉加载图片

          最近做的一个项目需要做页面无刷新下拉加载图片,调研了一番,大多都采用检测滚动条达到底部,然后利用ajax加载下一页数据对页面数据进行添加,根据这一逻辑,自己写了一个,具体代码如下: JQu ...

随机推荐

  1. VS2013第一个应用boost的程序

    下载boost binary https://sourceforge.net/projects/boost/files/boost-binaries/1.67.0_b1/ 由于我用的是Windows1 ...

  2. OpenGL ES 3.0之Texturing纹理详解(一)

    本文流程 1.Texturing基础 2.装载Texturing和mipmapping 3.纹理过滤和包装 4.Texture level-of-detail, swizzles, and depth ...

  3. 在sublime text2上安装xdebug

    目录 安装Xdebug extension 设定php.ini 安装Xdebug plugin for Sublime Text2 1.安装Xdebug extension 先从安装Xdebug开始, ...

  4. 使用Nexus管理maven仓库,setting文件理解

    来到新公司对很多陌生的技术一头雾水,以前在工作中没有真正使用过maven,于是强迫自己蛋定下来一个一个的突破,下面是我对maven的setting配置文件的理解,由于是现学的,难免可能会理解偏差,还请 ...

  5. SQL Server 之 附加数据库出现“ 拒绝访问 ”

    错误信息如下图所示,附加数据库时出现“拒绝访问”:   解决方案: 修改拒绝访问的文件的安全权限,这里是修改数据库的.mdf文件的安全权限.

  6. 微信小程序 - 分包加载(预下载)

    开发者可以通过配置,在进入小程序某个页面时,由框架自动预下载可能需要的分包,提升进入后续分包页面时的启动速度.对于独立分包,也可以预下载主包. 配置方法 预下载分包行为在进入某个页面时触发,通过在 a ...

  7. vcenter 5.1安装亲历

    这一步死活提示nslookup 解析不了 ping的结果如下: 下载http://support.microsoft.com/kb/929852 工具 禁用IPv6即可,而且还需要在DNS中创建反向查 ...

  8. 获取请求真实ip

    /** * Copyright (c) 2011-2014, James Zhan 詹波 (jfinal@126.com). * * Licensed under the Apache License ...

  9. HTML拾遗

    一:标签 1:强调 <strong>加醋.<em>斜体 2:单独样式 <span>如果不加样式,那它包围的文字就是普通文字,可以在span中增加样式,就所包围的内容 ...

  10. 从头開始学 RecyclerView(三) 封装简化

    前言 上一篇的代码,也是基于这些封装的. RV的封装,跟曾经的listView之类的封装,大同小异. 这里,从@devwiki 处,将代码搬过来.基本无改动 BaseHolder的优化 使ViewHo ...