AngularJs 文件上传(实现Multipart/form-data 文件的上传)
<!-- 上传yml文件 -->
<div class="blackBoard" ng-show="vm.showUpop==true"></div>
<div class="updaYMLpop" ng-show="vm.showUpop==true">
<div class="title">新建服务容器<span ng-click="vm.showUpop=false">×</span></div>
<ul>
<li>选择节点:<select ng-model="nodeInf" ng-options="n.addr for n in vm.nodeInf" ng-change="vm.nodeSele=nodeInf">
</select></li>
<li>指定路径:<input type="text" placeholder="请输入路径信息" class="ymLJ"></li>
<li>选择文件:<a href="javascript:;" class="file">文件
<input type="file" name="" id="" onchange="angular.element(this).scope().uploadDoc(this.files)">
</a></li>
</ul>
<div class="upbtn">
<button ng-click="vm.showUpop=false">取消</button>
<button class="upymBtn">添加</button>
</div>
</div>
控制器:
// 上传yml文件
$scope.uploadDoc = function (files) {
var fileLength = files[0].name.length;
var subName = files[0].name.slice(fileLength-4,fileLength);
if(subName!='.yml'){
alert("请上传yml格式文件");
} else{
var oFReader = new FileReader();
var form = new FormData();
var file = files[0];
form.append('file', file); var setData = {};
setData.node = Base64.encode(vm.nodeSele.addr);
setData.path = $(".updaYMLpop .ymLJ").val();
setData.file = file;
$(".updaYMLpop .file").text(files[0].name);
$(".upymBtn").bind("click",function(){
console.log(setData);
ContainerService.updateYml(setData,form)
.then(function(data) {
console.log(data);
// vm.refresh();
}, function(data) {
// console.log(data);
vm.error = data.data;
});
vm.showUpop=false;
})
}
}
updateYml: function(setData,fileOb) {
var promise = $http.post('/api/containers/ymldeploy?path='+setData.path+'&nodeaddr='+setData.node, fileOb, {
withCredentials: true,
headers: {'Content-Type': undefined },
transformRequest: angular.identity})
.then(function(response) {
console.log(response);
// return response.data;
return response;
});
return promise;
},
代码略粗糙,标红处比较要紧。
AngularJs 文件上传(实现Multipart/form-data 文件的上传)的更多相关文章
- python 处理form/data文件上传
处理multipart/form-data 的java serverlet请求接口通过python实现 记住不要在头加:"Content-Type":"multipart ...
- html5 file upload and form data by ajax
html5 file upload and form data by ajax 最近接了一个小活,在短时间内实现一个活动报名页面,其中遇到了文件上传. 我预期的效果是一次ajax post请求,然后在 ...
- Sending forms through JavaScript[form提交 form data]
https://developer.mozilla.org/en-US/docs/Learn/HTML/Forms/Sending_forms_through_JavaScript As in the ...
- 重新装Mysql后原来数据的恢复办法:即一个版本的mysql的data文件夹下的所有的数据,怎么去加载到另一个安装的mysql中
重新装Mysql后原来数据的恢复办法本博客:http://blog.csdn.net/xiaowu_zhu/article/details/71188955 不管是重新装系统或者数据库时,总会遇到怎么 ...
- MySql目录没有data文件夹怎么办
下载的是mysql的压缩包,解压后,更改my.ini文件,里面有个指向data文件夹的路径,但是mysql安装目录没有data文件夹,需要执行 mysqld --initialize --user=m ...
- sql server 2008怎样导入mdf,ldf文件,怎样解决导入mdf,ldf文件时出现附加数据库错误的问题
废话不多说,直入主题吧. 1:打开sql server 2008,右键数据库-->附加 2:这时出现这个界面点击添加 3:打开数据库实例的安装目录,打开DATA文件夹;(如我的实例目录地址为:D ...
- 利用Formdata实现form提交文件上传不跳转页面
作者:幻月九十链接:https://www.zhihu.com/question/19631256/answer/119911045来源:知乎著作权归作者所有,转载请联系作者获得授权. $('form ...
- Multipart/form-data POST文件上传详解
Multipart/form-data POST文件上传详解 理论 简单的HTTP POST 大家通过HTTP向服务器发送POST请求提交数据,都是通过form表单提交的,代码如下: <form ...
- Multipart/form-data POST文件上传详解(转)
Multipart/form-data POST文件上传详解 理论 简单的HTTP POST 大家通过HTTP向服务器发送POST请求提交数据,都是通过form表单提交的,代码如下: <form ...
- 文件上传时jquery.form.js中提示form.submit SCRIPT5: 拒绝访问
利用其它控件触发file的click事件来选择文件后,使用jquery.form.js中的submit方法提交时IE报错:form.submit SCRIPT5: 拒绝访问,其它浏览器正常, < ...
随机推荐
- 什么是HotSpot
Java 是动态编译,跟C++静态编译不同,这就是JIT编译器的原因(Just In Time) HotSpot会把这些部门动态地编译成机器码,Native code, 并对机器码进行优化, 静态编译 ...
- Vue使用,异步获取日期时间后格式成"/Date(1333245600000+0800)/" 转换成正常格式
js从后台mvc中日期获取,结果格式成"/Date(1333245600000+0800)/"了,当然不能这样展显给用户了,要转换,方法如下: function data_stri ...
- Jmeter介绍+安装
JMeter介绍 JMeter 是Apache 基金会Jakarta 上的一个纯Java 开源项目,起初用于基于Web 的压力测试(pressure test),后来其应用范围逐渐扩展到对文件传输FT ...
- Best Reward HDU - 3613(马拉车+枚举+前缀和)
题意: 给你一串字符串,每个字符都有一个权值,要求把这个字符串在某点分开,使之成为两个单独的字符串 如果这两个子串某一个是回文串,则权值为那一个串所有的字符权值和 若不是回文串,则权值为0 解析: 先 ...
- UVA - 11997(巧妙的优先队列)
题意: 有k个整数数组,各包含k个元素,在每个数组中取一个元素加起来,可以得到kk个和,求这些和中最小的k个值 解析: 从简单的情况开始分析:经典方法,对原题没有思路,那么分析问题的简化版 这是对于两 ...
- pbuilder编译构建工具分析
1. 简介 pbuilder(personal Debian package builder)是ubuntu环境下维护debian包的专业工具,能够为每个deb包创建纯净的编译构建环境,自动解析和安装 ...
- 【刷题】BZOJ 1030 [JSOI2007]文本生成器
Description JSOI交给队员ZYX一个任务,编制一个称之为"文本生成器"的电脑软件:该软件的使用者是一些低幼人群,他们现在使用的是GW文本生成器v6版.该软件可以随机生 ...
- 【BZOJ5415】【NOI2018】归程(克鲁斯卡尔重构树)
[NOI2018]归程(克鲁斯卡尔重构树) 题面 洛谷 题解 我在现场竟然没有把这道傻逼题给切掉,身败名裂. 因为这题就是克鲁斯卡尔重构树的模板题啊 我就直接简单的说一下把 首先发现答案就是在只经过海 ...
- Linux内核分析第三周——构造一个简单的Linux系统MenuOS
构造一个简单的Linux系统MenuOS 李雪琦 + 原创作品转载请注明出处 + <Linux内核分析>MOOC课程http://mooc.study.163.com/course/UST ...
- Android开发技术重要参考资料
只言片语 有的时候看不懂别人的代码,觉得自己笨:其实,你想多了,看不懂不是因为你蠢而是别人的代码写得烂:所以,别那么宽容别人却苛责自己. 参考资料 郭霖 way 爱哥 有心 胡凯 robin trin ...