Angular Js文件上傳之form-data
更新時(shí)間：2015年08月28日 11:34:00 投稿：mrr
angular-file-upload 是一個(gè)基于HTML5技術(shù)的文件上傳輕量級(jí) AngularJS指令（directive），當(dāng)瀏覽器不支持時(shí)轉(zhuǎn)為采用 FileAPI polyfill技術(shù)實(shí)現(xiàn)(基于Flash)。本文主要給大家介紹Angular Js文件上傳之form-data，需要的朋友可以參考下
前言：很久沒更新博客，最近公司pc端技術(shù)選型用angular,這幾天就趕鴨子上架，硬著頭皮直接上手angular。其中有許多小坑陸陸續(xù)續(xù)踩起走。今天就遇到一個(gè)比較常見的問題：圖片上傳。
主題：圖片上傳服務(wù)器，然后通過服務(wù)器傳阿里云。
不廢話了直接貼前端代碼：
$http({
method: ‘POST‘,
url: ‘/wechatapp/User/setAvatar‘,
data: data,
headers: {
‘Content-Type‘: undefined
},
transformRequest: function(data) {
var formData = new FormData();
formData.append(‘a(chǎn)vatar_data‘, data.adata);
formData.append(‘a(chǎn)vatar_file‘, data.file);
return formData;
},
data: {
adata: scope.avatar_data,
file: scope.avatar_file
}
}).success(function(d) {
//請(qǐng)求成功
cb(d);
}).error(function(err, status) {
console.log(err);
cb(err);
});
其實(shí)沒神馬難點(diǎn)，主要是取消post默認(rèn)的Content-Type,然后已FormData的方式上傳。一般ajax上傳文件都是以FormData方式傳。
以上就是本文給大家介紹Angular Js文件上傳之form-data，希望大家喜歡。
您可能感興趣的文章:
- JS中使用FormData上傳文件、圖片的方法
- JavaScript將base64圖片轉(zhuǎn)換成formData并通過AJAX提交的實(shí)現(xiàn)方法
- JS FormData上傳文件的設(shè)置方法
- js使用formData實(shí)現(xiàn)批量上傳
- vuejs使用FormData實(shí)現(xiàn)ajax上傳圖片文件
- Ajax+FormData+javascript實(shí)現(xiàn)無刷新表單信息提交
- js動(dòng)態(tài)在form上插入enctype=multipart/form-data的問題
- NodeJs form-data格式傳輸文件的方法
- Vue axios 將傳遞的json數(shù)據(jù)轉(zhuǎn)為form data的例子
- JS FormData對(duì)象使用方法實(shí)例詳解
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了基于JavaScript定位當(dāng)前的地理位置，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-04-04
這篇文章主要介紹了JavaScript 上傳文件限制參數(shù)案例詳解,本篇文章通過簡(jiǎn)要的案例,講解了該項(xiàng)技術(shù)的了解與使用,以下就是詳細(xì)內(nèi)容,需要的朋友可以參考下2021-09-09
javascript設(shè)計(jì)模式 – 中介者模式原理與用法實(shí)例分析
這篇文章主要介紹了javascript設(shè)計(jì)模式 – 中介者模式,結(jié)合實(shí)例形式分析了javascript中介者模式基本概念、原理、用法及操作注意事項(xiàng),需要的朋友可以參考下2020-04-04
在百度搜索結(jié)果中去除掉一些網(wǎng)站的資料(通過js控制不讓顯示)
這篇文章主要介紹了在百度搜索結(jié)果中去除掉一些網(wǎng)站的資料(通過js控制不讓顯示),需要的朋友可以參考下2017-05-05
js實(shí)現(xiàn)獲取最新本周周一開始的日期（單周日歷卡）
這篇文章主要為大家介紹了js實(shí)現(xiàn)獲取最新本周周一開始的日期（單周日歷卡）示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-10-10
連連看最難的部分應(yīng)該是路徑搜索，即鼠標(biāo)點(diǎn)的兩點(diǎn)之間看有無可通的路徑。 看過有人寫的遞歸寫法，心里癢癢，就捉摸了一下，發(fā)現(xiàn)不用遞歸的情況下難度也不大2013-12-12
左鍵復(fù)制對(duì)于所有人來說有好有壞，例如原創(chuàng)內(nèi)容就不想被別人復(fù)制，接下來介紹一種方法，有需要的朋友可以參考下2013-01-01
小程序開發(fā)實(shí)戰(zhàn)指南之封裝自定義彈窗組件
最近在做公司的小程序項(xiàng)目,發(fā)現(xiàn)設(shè)計(jì)上有很多不統(tǒng)一,代碼上有很多冗余,下面這篇文章主要給大家介紹了關(guān)于小程序開發(fā)實(shí)戰(zhàn)指南之封裝自定義彈窗組件的相關(guān)資料,需要的朋友可以參考下2022-11-11
這篇文章主要介紹了JS手寫一個(gè)自定義Promise操作,結(jié)合實(shí)例形式分析了JS自定義Promise的實(shí)現(xiàn)與使用相關(guān)操作技巧,需要的朋友可以參考下2020-03-03
js實(shí)現(xiàn)界面向原生界面發(fā)消息并跳轉(zhuǎn)功能
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)界面向原生界面發(fā)消息并跳轉(zhuǎn)功能,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-11-11