angularJS 发起$http.post和$http.get请求的实现方法


Posted in Javascript onMay 18, 2017

AngularJS发起$http.post请求

代码如下:

$http({ 
  method:'post', 
  url:'post.php', 
  data:{name:"aaa",id:1,age:20} 
}).success(function(req){ 
  console.log(req); 
})

这时候你会发现收不到返回的数据,结果为null,这是因为要转换成form data。

解决方案:

配置$httpProvider:

var myApp = angular.module('app',[]); 
 myApp.config(function($httpProvider){ 

  $httpProvider.defaults.transformRequest = function(obj){ 
   var str = []; 
   for(var p in obj){ 
    str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p])); 
   } 
   return str.join("&"); 
  } 

  $httpProvider.defaults.headers.post = { 
    'Content-Type': 'application/x-www-form-urlencoded' 
  } 

});

或者在post中配置:

$http({ 
  method:'post', 
  url:'post.php', 
  data:{name:"aaa",id:1,age:20}, 
  headers:{'Content-Type': 'application/x-www-form-urlencoded'}, 
  transformRequest: function(obj) { 
   var str = []; 
   for(var p in obj){ 
    str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p])); 
   } 
   return str.join("&"); 
  } 
}).success(function(req){ 
    console.log(req); 
})

AngularJS发起$http.post请求

代码如下:

app.controller('sprintCtrl', function($scope, $http) {
      $http.get("http://localhost:8080/aosapp/pt/service?formid=pt_aosapp_service_sprintlist&teamid=1")
      .success(function (response) {console.log($scope.sprintlist=response);});
    });

其实,angularjs 和 jquery js最大的区别在哪儿那,angularjs是你事先在心中构建好真个页面,然后用变量或者占位符来表示数据,数据来了,直接填充就可以了;而jquery则是动态的修改dom元素,如添加修改dom标签等。设计思想不一样。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript 继承的实现
Jul 09 Javascript
关于html+ashx开发中几个问题的解决方法
Jul 18 Javascript
js设置组合快捷键/tabindex功能的方法
Nov 21 Javascript
js中AppendChild与insertBefore的用法详细解析
Dec 16 Javascript
JavaScript+CSS控制打印格式示例介绍
Jan 07 Javascript
元素未显示设置width/height时IE中使用currentStyle获取为auto
May 04 Javascript
js调试系列 初识控制台
Jun 18 Javascript
jQuery时间轴插件使用详解
Jul 16 Javascript
Vue.js每天必学之Class与样式绑定
Sep 05 Javascript
vue中的自定义分页插件组件的示例
Aug 18 Javascript
修改vue+webpack run build的路径方法
Sep 01 Javascript
js实现页面多个日期时间倒计时效果
Jun 20 Javascript
微信小程序 wx.request方法的异步封装实例详解
May 18 #Javascript
微信小程序中input标签详解及简单实例
May 18 #Javascript
JavaScript运动框架 链式运动到完美运动(五)
May 18 #Javascript
JavaScript运动框架 多值运动(四)
May 18 #Javascript
微信小程序页面开发注意事项整理
May 18 #Javascript
基于BootStrap的前端分页带省略号和上下页效果
May 18 #Javascript
微信小程序网络请求wx.request详解及实例
May 18 #Javascript
You might like
二十行语句实现从Excel到mysql的转化
2006/10/09 PHP
Thinkphp中volist标签mod控制一定记录的换行BUG解决方法
2014/11/04 PHP
PHP使用Curl实现模拟登录及抓取数据功能示例
2018/04/27 PHP
原生JS实现Ajax通过GET方式与PHP进行交互操作示例
2018/05/12 PHP
ThinkPHP中图片按比例切割的代码实例
2019/03/08 PHP
读jQuery之十二 删除事件核心方法
2011/07/31 Javascript
javascript中的toFixed固定小数位数 简单实例分享
2013/07/12 Javascript
node+express+ejs制作简单页面上手指南
2014/11/26 Javascript
JavaScript调试工具汇总
2014/12/23 Javascript
JavaScript中操作字符串小结
2015/05/04 Javascript
js生成验证码并直接在前端判断
2015/05/15 Javascript
jquery 标签 隔若干行加空白或者加虚线的方法
2016/12/07 Javascript
使用bat打开多个cmd窗口执行gulp、node
2017/02/17 Javascript
详解vue嵌套路由-query传递参数
2017/05/23 Javascript
js的函数的按值传递参数(实例讲解)
2017/11/16 Javascript
详解如何实现一个简单的Node.js脚手架
2017/12/04 Javascript
javaScript产生随机数的用法小结
2018/04/21 Javascript
iview Upload组件多个文件上传的示例代码
2018/09/30 Javascript
JS 实现发送短信验证码的“59秒后重新发送验证短信”功能
2019/08/23 Javascript
VUE : vue-cli中去掉路由中的井号#操作
2020/09/04 Javascript
JS操作JSON常用方法(10w阅读)
2020/12/06 Javascript
python之文件的读写和文件目录以及文件夹的操作实现代码
2016/08/28 Python
python中cPickle类使用方法详解
2018/08/27 Python
Python获取航线信息并且制作成图的讲解
2019/01/03 Python
python运行时强制刷新缓冲区的方法
2019/01/14 Python
从列表或字典创建Pandas的DataFrame对象的方法
2019/07/06 Python
python实现登录密码重置简易操作代码
2019/08/14 Python
解决django-xadmin列表页filter关联对象搜索问题
2019/11/15 Python
Python模拟登录requests.Session应用详解
2020/11/17 Python
美国全球旅游运营商:Pacific Holidays
2018/06/18 全球购物
澳大利亚珍珠首饰购物网站:Vayo Pearls
2019/03/11 全球购物
八一演出活动方案
2014/02/03 职场文书
厨房领班竞聘演讲稿
2014/04/23 职场文书
2014年重阳节老干部座谈会上的讲话稿
2014/09/25 职场文书
学习走群众路线心得体会
2014/11/05 职场文书
2015年初一班主任工作总结
2015/05/13 职场文书