Angular Js文件上传之form-data

 更新时间:2015年08月28日 11:34:00   投稿:mrr  
angular-file-upload 是一个基于HTML5技术的文件上传轻量级 AngularJS指令(directive),当浏览器不支持时转为采用 FileAPI polyfill技术实现(基于Flash)。本文主要给大家介绍Angular Js文件上传之form-data,需要的朋友可以参考下

前言:很久没更新博客,最近公司pc端技术选型用angular,这几天就赶鸭子上架,硬着头皮直接上手angular。其中有许多小坑陆陆续续踩起走。今天就遇到一个比较常见的问题:图片上传。

主题:图片上传服务器,然后通过服务器传阿里云。

不废话了直接贴前端代码:

$http({
  method: ‘POST‘,
  url: ‘/wechatapp/User/setAvatar‘,
  data: data,
  headers: {
    ‘Content-Type‘: undefined
  },
  transformRequest: function(data) {
    var formData = new FormData();
    formData.append(‘avatar_data‘, data.adata);
    formData.append(‘avatar_file‘, data.file);
    return formData;
  },
  data: {
    adata: scope.avatar_data,
    file: scope.avatar_file
  }
  }).success(function(d) {
    //请求成功
    cb(d);
  }).error(function(err, status) {
    console.log(err);
    cb(err);
  });

其实没神马难点,主要是取消post默认的Content-Type,然后已FormData的方式上传。一般ajax上传文件都是以FormData方式传。

以上就是本文给大家介绍Angular Js文件上传之form-data,希望大家喜欢。

相关文章

  • 详解JavaScript节流函数中的Throttle

    详解JavaScript节流函数中的Throttle

    函数节流,就是对会频繁触发的函数事件做一些限制,让这些函数可以在每隔一定的时间或者每次满足一定的条件下再触发。一般我们会给他起一个名字throttle。也就是节流的意思。一般这样的函数有 resize事件、ontouchmove事件等。
    2016-07-07
  • JavaScript实现简单Tip提示框效果

    JavaScript实现简单Tip提示框效果

    这篇文章主要介绍了JavaScript实现简单Tip提示框效果,涉及JavaScript响应鼠标事件针对页面元素动态操作的相关技巧,需要的朋友可以参考下
    2016-04-04
  • 用javascript获取地址栏参数

    用javascript获取地址栏参数

    用javascript获取地址栏参数...
    2006-12-12
  • JSDoc 介绍使用规范JsDoc的使用介绍

    JSDoc 介绍使用规范JsDoc的使用介绍

    JsDoc Toolkit 是一个把js描述格式化成文档的工具。开发者只需按JsDoc的规范写好注释就可以很方便导出文档。它是google 推荐的 JsDoc生成工具。
    2011-02-02
  • 分享Typescript的13个基础语法

    分享Typescript的13个基础语法

    这篇文章主要分享了Typescript的14个基础语法,Typescript可以说是JavaScript的超集,在JS的基础上新增了许多语法特性,使得类型不再可以随意转换,能大大减少开发阶段的错误。
    2021-12-12
  • 一个级联菜单代码学习及removeClass与addClass的应用

    一个级联菜单代码学习及removeClass与addClass的应用

    最近在学些web前段的知识,看见博客园首页左侧的一个级联菜单,很是好奇,于是想自己实现以下,代码书写很简洁而且易懂,感兴趣的朋友可以了解下,希望本文对你学习级联菜单有所帮助
    2013-01-01
  • JS数组splice操作实例分析

    JS数组splice操作实例分析

    这篇文章主要介绍了JS数组splice操作,结合实例形式分析了javascript使用splice方法删除数组元素相关操作技巧,需要的朋友可以参考下
    2019-10-10
  • (跨浏览器基础事件/浏览器检测/判断浏览器)经验代码分享

    (跨浏览器基础事件/浏览器检测/判断浏览器)经验代码分享

    一些js代码,自己备用的,高手不要笑话我。(跨浏览器基础事件,浏览器检测,判断浏览器的名称、版本号、操作系统)等等,很实用的,方便自己使用,感兴趣的朋友可以了解下,希望本文对你有所帮助
    2013-01-01
  • JS 实现列表与多选框选择附预览动画

    JS 实现列表与多选框选择附预览动画

    本节为大家介绍的是用JS实现列表与多选框选择,并附gif演示动画,这个例子很详细,大家可以看看
    2014-10-10
  • js监听输入框值的即时变化onpropertychange、oninput

    js监听输入框值的即时变化onpropertychange、oninput

    很多情况下我们都会即时监听输入框值的变化,以便作出即时动作去引导浏览者增强网站的用户体验感。
    2011-07-07

最新评论