AngularJS $http模块POST请求实现


Posted in Javascript onApril 08, 2017

一、代码如下:

$http({ 


  method:'post', 

  url:'post.php', 

  data:{name:"aaa",id:1,age:20} 

}).success(function(req){ 

  console.log(req); 

})

解决方案:

1、 

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("&");

  2.  

$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);

})

 php

$rawpostdata = file_get_contents("php://input");
 $post = json_decode($rawpostdata, true);
 //传的数据都在$post中了;

二、 $http请求数据主要会有以下三种方式

1.get请求

2.post请求

3.jsonp

<!DOCTYPE html>
<html lang="zh_CN">
<head>
  <meta charset="UTF-8">
  <title>Angular基础</title>
</head>
<body>
<div ng-app="myApp">
  <div ng-controller="personCtrl">
    姓:<input type="text" ng-model="firstName"/><br/>
    名:<input type="text" ng-model="lastName"/><br/>
    姓名:<span ng-bind="firstName"></span><span ng-bind="lastName"></span>
  </div>

</div>
<script src="angular.min.js"></script>
<script type="application/javascript">
  var myApp=angular.module('myApp',[]);
  myApp.controller('personCtrl',function($scope,$http){
    $http.get('getData.php').
        success(function(data) {
          console.log(data);
        }).
        error(function(err) {
          //错误代码
        });
    //$http.post采用postJSON方式发送数据到后台,
    // 解决办法:在后台php中使用$postData=file_get_contents("php://input",true);这样就可以获得前端传送过来的数据
    var postData={msg:'post的内容'};
    var config={params:{id:'5',name:'张三丰'}};
    $http.post('postData.php', postData,config).
        success(function(data) {
          console.log(data);
        }).
        error(function(err) {
          //错误代码
        });
    var myUrl ="http://www.phonegap100.com/appapi.php?a=getPortalList&catid=20&page=1&callback=JSON_CALLBACK";
    $http.jsonp(myUrl).success(
        function(data){
          console.log(data);
        }
    ).error(function(err){
          //错误代码
        });
    $scope.firstName="Wang";
    $scope.lastName="Ben";
  });


</script>
</body>
</html>
<?php
//postData.php文件

//用接收json数据的方式
$msg=file_get_contents("php://input",true);

$name=$_GET['name'];
echo $name.$msg."_post";

显示效果:

AngularJS $http模块POST请求实现

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

Javascript 相关文章推荐
jquery链式操作的正确使用方法
Jan 06 Javascript
jQuery formValidator表单验证
Jan 07 Javascript
完全深入学习Bootstrap表单
Nov 28 Javascript
jquery 正整数数字校验正则表达式
Jan 10 Javascript
angularjs+bootstrap实现自定义分页的实例代码
Jun 19 Javascript
Node.js 基础教程之全局对象
Aug 06 Javascript
angular 实现下拉列表组件的示例代码
Mar 09 Javascript
Vue中的组件及路由使用实例代码详解
May 22 Javascript
解决layui数据表格Date日期格式的回显Object的问题
Sep 19 Javascript
javascript实现文字跑马灯效果
Jun 18 Javascript
js实现鼠标拖曳效果
Dec 30 Javascript
JavaScript事件的委托(代理)的用法示例详解
Feb 18 Javascript
node.js实现登录注册页面
Apr 08 #Javascript
详解vue2路由vue-router配置(懒加载)
Apr 08 #Javascript
js仿微信公众平台打标签功能
Apr 08 #Javascript
详解node.js搭建代理服务器请求数据
Apr 08 #Javascript
无循环 JavaScript(map、reduce、filter和find)
Apr 08 #Javascript
JavaScript中的遍历详解(多种遍历)
Apr 07 #Javascript
分享十三个最佳JavaScript数据网格库
Apr 07 #Javascript
You might like
php查看session内容的函数
2008/08/27 PHP
php在window iis的莫名问题的测试方法
2013/05/14 PHP
PHP对象相互引用的内存溢出实例分析
2014/08/28 PHP
PHP 根据key 给二维数组分组
2016/12/09 PHP
PHP实现将几张照片拼接到一起的合成图片功能【便于整体打印输出】
2017/11/14 PHP
JavaScript动态调整TextArea高度的代码
2010/12/28 Javascript
jquery.Jwin.js 基于jquery的弹出层插件代码
2012/05/23 Javascript
jquery动画1.加载指示器
2012/08/24 Javascript
javascript中的void运算符语法及使用介绍
2013/03/10 Javascript
Flex通过JS获取客户端IP和计算机名的实例代码
2013/11/21 Javascript
jquery引用方法时传递参数原理分析
2014/10/13 Javascript
Javascript 构造函数详解
2014/10/22 Javascript
node.js中的console.dir方法使用说明
2014/12/10 Javascript
深入理解JavaScript系列(30):设计模式之外观模式详解
2015/03/03 Javascript
使用DNode实现php和nodejs之间通信的简单实例
2015/07/06 NodeJs
JS转换HTML转义符的方法
2016/08/24 Javascript
各式各样的导航条效果css3结合jquery代码实现
2016/09/17 Javascript
javascript的document中的动态添加标签实现方法
2016/10/24 Javascript
Javascript使用SWFUpload进行多文件上传
2016/11/16 Javascript
微信小程序 swiper制作tab切换实现附源码
2017/01/21 Javascript
Node.js readline 逐行读取、写入文件内容的示例
2018/03/01 Javascript
微信小程序模板template简单用法示例
2018/12/04 Javascript
[50:59]2018DOTA2亚洲邀请赛 4.7 总决赛 LGD vs Mineski第四场
2018/04/10 DOTA
python中文分词教程之前向最大正向匹配算法详解
2017/11/02 Python
Python实现基于TCP UDP协议的IPv4 IPv6模式客户端和服务端功能示例
2018/03/22 Python
Python对List中的元素排序的方法
2018/04/01 Python
Python实现删除时保留特定文件夹和文件的示例
2018/04/27 Python
浅谈tensorflow中几个随机函数的用法
2018/07/27 Python
python实现文件助手中查看微信撤回消息
2019/04/29 Python
python程序中的线程操作 concurrent模块使用详解
2019/09/23 Python
New Balance德国官方网站:购买鞋子和服装
2019/08/31 全球购物
成功经营餐厅的创业计划书范文
2013/12/26 职场文书
商场消防演习方案
2014/02/12 职场文书
村干部培训班主持词
2014/03/28 职场文书
在Django中使用MQTT的方法
2021/05/10 Python
Spring Data JPA框架的核心概念和Repository接口
2022/04/28 Java/Android