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 相关文章推荐
js模拟实现Array的sort方法
Dec 11 Javascript
jQuery 名称冲突的解决方法
Apr 08 Javascript
Javascript控制页面链接在新窗口打开具体方法
Aug 16 Javascript
jquery+CSS3模拟Path2.0动画菜单效果代码
Aug 31 Javascript
jQuery ztree实现动态树形多选菜单
Aug 12 Javascript
JavaScript第一篇之实现按钮全选、功能
Aug 21 Javascript
JavaScript重复元素处理方法分析【统计个数、计算、去重复等】
Dec 14 Javascript
vue配置nprogress实现页面顶部进度条
Sep 21 Javascript
javascript如何实现create方法
Nov 04 Javascript
浅谈如何优雅处理JavaScript异步错误
Nov 12 Javascript
Vue 的双向绑定原理与用法揭秘
May 06 Javascript
Electron实现应用打包、自动升级过程解析
Jul 07 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
深入解析php之sphinx
2013/05/15 PHP
PHP回调函数概念与用法实例分析
2017/11/03 PHP
Avengerls vs Newbee BO3 第三场2.18
2021/03/10 DOTA
CSS和Javascript简单复习资料
2010/06/29 Javascript
有趣的javascript数组定义方法
2010/09/10 Javascript
JavaScript的document对象和window对象详解
2010/12/30 Javascript
jquery内置验证(validate)使用方法示例(表单验证)
2013/12/04 Javascript
js调试系列 控制台命令行API使用方法
2014/06/18 Javascript
JavaScript中的ArrayBuffer详细介绍
2014/12/08 Javascript
javascript实现图片延迟加载方法汇总(三种方法)
2015/08/27 Javascript
javascript中tostring()和valueof()的用法及两者的区别
2015/11/16 Javascript
js仿3366小游戏选字游戏
2016/04/14 Javascript
JavaScript关于提高网站性能的几点建议(一)
2016/07/24 Javascript
Angular2数据绑定详解
2017/04/18 Javascript
js+css实现打字效果
2020/06/24 Javascript
axios携带cookie配置详解(axios+koa)
2018/12/28 Javascript
Python  __getattr__与__setattr__使用方法
2008/09/06 Python
Python写的Tkinter程序屏幕居中方法
2015/03/10 Python
11个并不被常用但对开发非常有帮助的Python库
2015/03/31 Python
python实现矩阵乘法的方法
2015/06/28 Python
Python 的内置字符串方法小结
2016/03/15 Python
Python 实现「食行生鲜」签到领积分功能
2018/09/26 Python
django 邮件发送模块smtp使用详解
2019/07/22 Python
python实现word文档批量转成自定义格式的excel文档的思路及实例代码
2020/02/21 Python
pycharm的python_stubs问题
2020/04/08 Python
在tensorflow下利用plt画论文中loss,acc等曲线图实例
2020/06/15 Python
浅谈Python协程
2020/06/17 Python
canvas裁剪clip()函数的具体使用
2018/03/01 HTML / CSS
HTML5超文本标记语言的实现方法
2020/09/24 HTML / CSS
你所在的项目是如何确定版本号的
2015/12/28 面试题
药学专业大学生个人的自我评价
2013/11/04 职场文书
《邮票齿孔的故事》教学反思
2014/02/22 职场文书
典型事迹材料范文
2014/12/29 职场文书
2016个人廉洁自律承诺书
2016/03/25 职场文书
读《皮囊》有感:理解是对他人的最大的善举
2019/11/14 职场文书
python 实现的截屏工具
2021/05/08 Python