angularjs中$http异步上传Excel文件方法


Posted in Javascript onFebruary 23, 2018

1.文件上传框html代码如下

<form id="fileForm" enctype="multipart/form-data">
 <button id="import_asset" type="button" ng-click="import_asset()">上传文件</button>
 <input id="file_asset" type="file" style="display: none;"/>
</form>

*注意: 设置form的enctype属性值为:multipart/form-data

2:js代码如下:

$scope.import_asset = function () {
 $("#file_asset").click();
};
$("#file_asset").on("change", function(){
 var formData = new FormData();
 var file = document.getElementById("file_asset").files[0];
 if(file.name){
  var fileName = file.name.substring(file.name.lastIndexOf(".") + 1);
  if(fileName =="xlsx" || fileName =="xls"){
   formData.append('file', file);
   $http({
    method:"post",
    url:commonService.projectName + "/so/assetmanage/upload",
    data:formData,
    headers : {
     'Content-Type' : undefined
    },
    transformRequest : angular.identity
   }).then(function (response) {
    if(response.status == 200){
     alert("文件上传成功!!!");
    }else{
     alert("文件上传失败!!!");
    }
   });
  }else{
   alert("文件格式不正确,请上传以.xlsx,.xls 为后缀名的文件。");
   $("#file_asset").val("");
  }
 }
});
Javascript 相关文章推荐
关于javascript event flow 的一个bug详解
Sep 17 Javascript
jQuery中DOM树操作之使用反向插入方法实例分析
Jan 23 Javascript
jQuery获取元素父节点的方法
Jun 21 Javascript
浅谈js数据类型判断与数组判断
Aug 29 Javascript
jQuery与JS加载事件用法分析
Sep 04 Javascript
jQuery日程管理插件fullcalendar使用详解
Jan 07 Javascript
JS将unicode码转中文方法
May 08 Javascript
apicloud拉起小程序并传递参数的方法示例
Nov 21 Javascript
9102了,你还不会移动端真机调试吗
Mar 25 Javascript
vue+express+jwt持久化登录的方法
Jun 14 Javascript
微信小程序如何实现精确的日期时间选择器
Jan 21 Javascript
解决Echarts 显示隐藏后宽度高度变小的问题
Jul 19 Javascript
浅谈vuejs实现数据驱动视图原理
Feb 23 #Javascript
Vue父组件调用子组件事件方法
Feb 23 #Javascript
vue实现密码显示隐藏切换功能
Feb 23 #Javascript
对vue.js中this.$emit的深入理解
Feb 23 #Javascript
基于vue.js中事件修饰符.self的用法(详解)
Feb 23 #Javascript
vue.js2.0点击获取自己的属性和jquery方法
Feb 23 #jQuery
vue中动态绑定表单元素的属性方法
Feb 23 #Javascript
You might like
一些使用频率比较高的php函数
2008/10/03 PHP
linux php mysql数据库备份实现代码
2009/03/10 PHP
php 随机数的产生、页面跳转、件读写、文件重命名、switch语句
2009/08/07 PHP
PHP MVC模式在网站架构中的实现分析
2010/03/04 PHP
php_screw 1.5:php加密: 安装与使用详解
2013/06/20 PHP
CodeIgniter配置之SESSION用法实例分析
2016/01/19 PHP
js精度溢出解决方案
2012/12/02 Javascript
纯javascript移动优先的幻灯片效果
2015/11/02 Javascript
全面解析Bootstrap排版使用方法(文字样式)
2015/11/30 Javascript
JavaScript设计模式之构造函数模式实例教程
2018/07/02 Javascript
create-react-app安装出错问题解决方法
2018/09/04 Javascript
微信小程序开发实现的IP地址查询功能示例
2019/03/28 Javascript
vue从一个页面跳转到另一个页面并携带参数的解决方法
2019/08/12 Javascript
vue3 源码解读之 time slicing的使用方法
2019/10/31 Javascript
[07:12]2014DOTA2西雅图国际邀请赛 黑马Liquid专题采访
2014/07/12 DOTA
python实现的防DDoS脚本
2011/02/08 Python
使用Python获取网段IP个数以及地址清单的方法
2018/11/01 Python
使用Python合成图片的实现代码(图片添加个性化文本,图片上叠加其他图片)
2020/04/30 Python
python 动态绘制爱心的示例
2020/09/27 Python
CSS3效果:自定义“W”形运行轨迹实例
2017/03/29 HTML / CSS
世界第一冲浪品牌:O’Neill
2016/08/30 全球购物
印度婴儿用品在线商店:Firstcry.com
2016/12/05 全球购物
戴森西班牙官网:Dyson西班牙
2020/02/04 全球购物
写给老师的表扬信
2014/01/21 职场文书
秋季运动会广播稿大全
2014/02/17 职场文书
淘宝好评语大全
2014/05/05 职场文书
三月雷锋月活动总结
2014/07/03 职场文书
职工年度考核评语
2014/12/31 职场文书
工作违纪检讨书范文
2015/01/26 职场文书
男方家长婚礼致辞
2015/07/27 职场文书
我的生日感言
2015/08/03 职场文书
《倍数和因数》教学反思
2016/02/23 职场文书
2019年汽车租赁合同范本!
2019/08/12 职场文书
《敬重卑微》读后感3篇
2019/11/26 职场文书
uniapp 微信小程序 自定义tabBar 导航
2022/04/22 Javascript
总结三种用 Python 作为小程序后端的方式
2022/05/02 Python