angularjs上传图片和文件
很简单:
$scope.upload = function() {
var f = $scope.myFile;
var fd = new FormData();
var img = document.querySelector('input[type=file]').files[0];
//var file = [];
//file.push(f);
// file.push(img);
fd.append('issueId', '1');
fd.append('file', img);
$http.post('/images', fd, {
transformRequest: angular.identity,
headers: {
'Content-Type': undefined
}
}).success(function (response) {
debugger;
}).error(function(response) {
debugger;
});
};
html
<div class="container" style="boeder: 1px solid #ddd">
<input type="file" name="pic" id="pic" emms-file-upload="myFile">
<a class="btn btn-primary" ng-click="upload()">upload</a>
</div>
directives: 可用可不用
emmsMobile.directive('emmsFileUpload', function() {
return {
restrict: 'ACE',
link: function(scope, elem, attr) {
elem.on('change', function() {
scope.file = this.files[];
})
},
scope: {
file: '=emmsFileUpload'
}
}
})
angularjs上传图片和文件的更多相关文章
- 用AJAX实现上传图片或者文件的方法
大家好,我是小C,最近在项目中用到ajax上传图片文件,本篇我们就说说ajax上传文件. 我们平时用到的AJAX,大部分都是传几个参数就可以了.简单说就是传几个字符串. $.ajax({ url: u ...
- sau交流学习社区--在element-ui中新建FormData对象组合上传图片和文件的文件对象,同时需要携带其他参数
今天有一个坑,同时要上传图片和文件,而且图片要展示缩略图,文件要展示列表. 我的思路是: 首先,只上传附件照片,这个直接看ele的官方例子就行,不仅仅上传附件照片,还同时上传其他参数. 然后,再做上传 ...
- flask上传图片或者文件
在flask unittest自动化测试中如何上传图片或者文件 import StringIO picture = StringIO.StringIO(open('/home/admin/Pictur ...
- ajax 提交所有表单内容及上传图片(文件),以及单独上传某个图片(文件)
我以演示上传图片为例子: java代码如下(前端童鞋可以直接跳过看下面的html及js): package com.vatuu.web.action; import java.io.File; imp ...
- angularjs上传图片
通过AngularJS实现图片上传及缩略图展示(读取文件内容) AngularJS图片上传功能的实现(读取文件内容) AngularJs实现Multipart/form-data 文件的上传(上传文件 ...
- php无刷新上传图片和文件
核心思想:通过Html的iframe标签属性操作顶级窗口,再用php动态无刷新上传图片文件. 示例如下: demo |------uploads #存放上传的文件 |------index.php | ...
- 关于Asp.Net Mvc3.0 使用KindEditor4.0 上传图片与文件
http://blog.csdn.net/fyxq14hao/article/details/7245502 今天我们的Asp.Net Mvc 3的项目中,把KindEditor3.9改为 KindE ...
- Ueditor 1.4.3 单独调用上传图片,或文件功能
第一步, 引入文件 <script src="ueditor/ueditor.config.js" type="text/javascript" char ...
- yii中上传图片及文件
Yii 提供了 CUploadedFile 来上传文件,比如图片,或者文档. 官方关于这个类的介绍 : http://www.yiichina.com/api/CUploadedFile CUploa ...
随机推荐
- ubuntu设置网络
二 .设置无线网络 1.首先确认一下你的无线驱动已经安装 方法一,查看一下ubuntu右上角的网络设置中有无线连接,如果有说明已经驱动了,ubuntu自带的就会驱动无线网卡. 方法二,iwconfig ...
- Android开发——fragment中数据传递与刷新UI(更改控件)
数据传递: 1.通过数据库进行数据的传递 如在fragment中将数据保存在数据库中,之后其他的fragment或者activity直接读取数据库中的数据,数据库使用还算简单,这里就不多说,建议使用l ...
- Jpa中设置OneToMany插入报异常解决办法
在Jpa中如果设置@OneToMany,但使用的时候,如果没有赋值,会报异常出现,这时只需要实例化一个空数组即可, 但类型一定要对应: 实例如下: newField.setxxxxxList(new ...
- golang调试工具Delve
Devle是一个非常棒的golang 调试工具,支持多种调试方式,直接运行调试,或者attach到一个正在运行中的golang程序,进行调试. 线上golang服务出现问题时,Devle是必不少的在线 ...
- mongodb命令行group分组和java代码中group分组
group分组统计是数据库比较常用的功能,mongodb也不例外.不过相对于普通的增删改查,group操作就略微麻烦一些, 这里对group在shell中的操作.使用java原生代码操作以及集成spr ...
- Android4种网络连接方式HttpClient、HttpURLConnection、OKHttp和Volley优缺点和性能对比
比较的指标: 1.cpu 2.流量 3.电量 4.内存占用 5.联网时间 功能点: 1.重试机制 2.提供的扩展功能 3.易用性 4.是否https 5.是否支持reflect api,OkHttp有 ...
- HI3531的DDR3配置流程
DDR3 初始化配置流程 系统上电之后,必须先完成DDR3 SDRAM 的初始化操作,系统才能访问DDR3 SDRAM.在进行初始化之前需要注意以下几点: 对DDR3 SDRAM 进行上电操作时,需要 ...
- Excel 2010高级应用-面积图(三)
Excel 2010高级应用-面积图(三) 操作过程如下: 1.新建Excel空白文档,重新命名为面积图 2.单击"插入",找到面积图图样 3.选择其中一种类型的面积图,单击并在空 ...
- (十二)java嵌套类和内部类
嵌套类和内部类:在一个类里边定义的类叫做嵌套类,其中没有static修饰的嵌套类是我们通常说的内部类,而被static修饰的嵌套类不常用.有的地方没有嵌套类和内部类的区分,直接是嵌套类就称作内部类,没 ...
- Linux显示服务器完整的状态信息
Linux显示服务器完整的状态信息 youhaidong@youhaidong-ThinkPad-Edge-E545:~$ apachectl [fullstatus] Usage: /usr/sbi ...