Angularjs中$http以post请求通过消息体传递参数的实现方法


Posted in Javascript onAugust 05, 2016

本文实例讲述了Angularjs中$http以post请求通过消息体传递参数的方法。分享给大家供大家参考,具体如下:

Angularjs中,$http以post在消息体中传递参数,需要做以下修改,以确保消息体传递参数的正确性。

一、在声明应用的时候进行设置:

var httpPost = function($httpProvider) {
  /*******************************************
  说明:$http的post提交时,纠正消息体
  ********************************************/
  // Use x-www-form-urlencoded Content-Type
  $httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8';
  /*
   * The workhorse; converts an object to x-www-form-urlencoded serialization.
   * @param {Object} obj
   * @return {String}
   */
  var param = function(obj) {
    var query = '', name, value, fullSubName, subName, subValue, innerObj, i;
    for (name in obj) {
      value = obj[name];
      if (value instanceof Array) {
        for (i = 0; i < value.length; ++i) {
          subValue = value[i];
          fullSubName = name + '[' + i + ']';
          innerObj = {};
          innerObj[fullSubName] = subValue;
          query += param(innerObj) + '&';
        }
      } else if (value instanceof Object) {
        for (subName in value) {
          subValue = value[subName];
          fullSubName = name + '[' + subName + ']';
          innerObj = {};
          innerObj[fullSubName] = subValue;
          query += param(innerObj) + '&';
        }
      } else if (value !== undefined && value !== null)
        query += encodeURIComponent(name) + '=' + encodeURIComponent(value) + '&';
    }
    return query.length ? query.substr(0, query.length - 1) : query;
  };
  // Override $http service's default transformRequest
  $httpProvider.defaults.transformRequest = [
    function(data) {
      return angular.isObject(data) && String(data) !== '[object File]' ? param(data) : data;
    }
  ];
};
var ngApp = angular.module('wtApp', ['ngCookies'], httpPost);

二、调用$http post

$http({
  method: 'POST',
  url: 'GetData.ashx',
  params: { id: '1002' },//params作为url的参数
  data: { keyName: 'qubernet' }//作为消息体参数
}, function (data) {
});

希望本文所述对大家AngularJS程序设计有所帮助。

Javascript 相关文章推荐
16个最流行的JavaScript框架[推荐]
May 29 Javascript
jQuery表格插件ParamQuery简单使用方法示例
Dec 05 Javascript
javascript表单验证使用示例(javascript验证邮箱)
Jan 07 Javascript
网页收藏夹显示ICO图标(代码少)
Aug 04 Javascript
创建基于Bootstrap的下拉菜单的DropDownList的JQuery插件
Jun 02 Javascript
AngularJS之依赖注入模拟实现
Aug 19 Javascript
利用vscode编写vue的简单配置详解
Jun 17 Javascript
深入剖析Node.js cluster模块
May 23 Javascript
js中this的指向问题归纳总结
Nov 28 Javascript
使用webpack搭建vue项目及注意事项
Jun 10 Javascript
vue如何搭建多页面多系统应用
Jun 17 Javascript
jQuery实现穿梭框效果
Jan 19 jQuery
原生js获取iframe中dom元素--父子页面相互获取对方dom元素的方法
Aug 05 #Javascript
Angularjs使用directive自定义指令实现attribute继承的方法详解
Aug 05 #Javascript
js从外部获取图片的实现方法
Aug 05 #Javascript
Angularjs的ng-repeat中去除重复数据的方法
Aug 05 #Javascript
jquery 点击元素后,滚动条滚动至该元素位置的方法
Aug 05 #Javascript
AngularJS在IE下取数据总是缓存问题的解决方法
Aug 05 #Javascript
JavaScipt选取文档元素的方法(推荐)
Aug 05 #Javascript
You might like
php长字符串定义方法
2012/07/12 PHP
php输出1000以内质数(素数)示例
2014/02/16 PHP
laravel创建类似ThinPHP中functions.php的全局函数
2016/11/26 PHP
Javascript模块模式分析
2008/05/16 Javascript
使用jQuery+HttpHandler+xml模拟一个三级联动的例子
2011/08/09 Javascript
游览器中javascript的执行过程(图文)
2012/05/20 Javascript
js 获取计算后的样式写法及注意事项
2013/02/25 Javascript
基于JavaScript自定义构造函数的详解说明
2013/04/24 Javascript
js校验表单后提交表单的三种方法总结
2014/02/28 Javascript
jQuery中last()方法用法实例
2015/01/06 Javascript
jquery判断至少有一个checkbox被选中的方法
2015/06/05 Javascript
node网页分段渲染详解
2016/09/05 Javascript
详解Angular 开发环境搭建
2017/06/22 Javascript
layui button 按钮弹出提示窗口,确定才进行的方法
2019/09/06 Javascript
vue-router路由懒加载及实现的3种方式
2021/02/28 Vue.js
Python修改Excel数据的实例代码
2013/11/01 Python
Python正则表达式非贪婪、多行匹配功能示例
2017/08/08 Python
Python+tkinter模拟“记住我”自动登录实例代码
2018/01/16 Python
Django框架模板注入操作示例【变量传递到模板】
2018/12/19 Python
python微信撤回监测代码
2019/04/29 Python
将python2.7添加进64位系统的注册表方式
2019/11/20 Python
python重要函数eval多种用法解析
2020/01/14 Python
Tensorflow中tf.ConfigProto()的用法详解
2020/02/06 Python
Python大批量搜索引擎图像爬虫工具详解
2020/11/16 Python
html5中地理位置定位api接口开发应用小结
2013/01/04 HTML / CSS
美国男装连锁零售商:Men’s Wearhouse
2016/10/14 全球购物
Dockers鞋官网:Dockers Shoes
2018/11/13 全球购物
Juice Beauty官网:有机美容产品,护肤与化妆品
2020/06/13 全球购物
存储过程和函数的区别
2013/05/28 面试题
祖国在我心中演讲稿(小学生)
2014/09/23 职场文书
教师党员学习群众路线心得体会
2014/11/04 职场文书
大学生英文求职信范文
2015/03/19 职场文书
2015年度内部审计工作总结
2015/05/20 职场文书
何玥事迹观后感
2015/06/16 职场文书
vue+elementui 实现新增和修改共用一个弹框的完整代码
2021/06/08 Vue.js
Python语言规范之Pylint的详细用法
2021/06/24 Python