angular.js的post数据方式
公司的项目前端部分现在改用angular,一切从头学起,今天记录一下关于数据请求的问题,由于get的请求方式比较简单,与post也类似,所以就单独讲讲post方式。
文档上post数据的写法有好几种,都是利用$http模块,通用写法如下:
// Simple GET request example:
$http({
method: 'GET',
url: '/someUrl'
}).then(function successCallback(response) {
// this callback will be called asynchronously
// when the response is available
}, function errorCallback(response) {
// called asynchronously if an error occurs
// or server returns response with an error status.
});
然后我们将方式改为post,加上data试一下。
$http({
method:'post',
url:'test.php',
data:{name:'test',age:20},
}).then(function successCallback(response) {
alert('添加成功');
}, function errorCallback(response) {
alert('添加失败');
});
php文件中我们就写一行print_r($_POST)即可。
打开谷歌浏览器F12,查看下调试信息,发现数据传输过去了

但是细心的朋友一定会发现一个问题,就是我们这里的传输方式是request playload,而不是我们通常的form data。他俩最大的区别就是,request playload的方式我们在php文件中通过$_POST是拿不到传过来的数据的。可以看到返回的打印信息为空。

我们再修改一下,加上headers和transformRequest
$http({
method:'post',
url:'test.php',
data:{name:'test',age:20},
headers:{'Content-Type': 'application/x-www-form-urlencoded'},
transformRequest: function (data) {
return $.param(data);
}
}).then(function successCallback(response) {
alert('添加成功');
}, function errorCallback(response) {
alert('添加失败');
});
然后查看返回值

成功了,并且此时传输方式变成了

OK,over!
angular.js的post数据方式的更多相关文章
- angular js 指令的数据传递 及作用域数据绑定
<div my-directive my-url="http://google.com" my-link-text="Click me to go to Googl ...
- angular js 页面修改数据存入数据库
一.编写service,修改数据要根据ID回显数据 //根据ID查询 public Brand findById(Long id); //修改 public int update(Brand bran ...
- angular js 页面添加数据保存数据库
一.编写实体类Controller层返回数据使用 package entity; import java.io.Serializable; public class Result implements ...
- {{angular.js 使用技巧}} - 基于验证框架的扩展(w5cValidator)
开场白: angular.js 是谷歌出的前端js MV*框架,我也是今年做 worktile 的时候才开始接触的,起初技术选型的时候还准备使用 backbone(毕竟很多大公司在使用他,而且也是比较 ...
- Angular js 之动态传数据到下一个页面和动态通过ng-click进入不同的页面
+关于Angular js中一些千篇一律的后台获取数据 首先在services.js里面把服务写好 然后在controller里面把数据给打印出来 (首先需要把数据注入) +关于Angular js中 ...
- 抓取Js动态生成数据且以滚动页面方式分页的网页
代码也可以从我的开源项目HtmlExtractor中获取. 当我们在进行数据抓取的时候,如果目标网站是以Js的方式动态生成数据且以滚动页面的方式进行分页,那么我们该如何抓取呢? 如类似今日头条这样的网 ...
- angular.js 中同步视图和模型数据双向绑定,$watch $digest $apply 机制
Angular.js 中的特性,双向绑定. 让视图的改变直接反应到数据中,数据的改变又实时的通知到视图,如何做到的? 这要归功于 scope 下面3个重要的方法: $watch $digest $ap ...
- angular js 模拟获取后台的数据
在这里我们把后台的数据用一个.json文件进行代替. 项目的目录结构如下: puDongLibraryLearning----ui-router-learning ---- data-------pe ...
- MVC、MVP、MVVM、Angular.js、Knockout.js、Backbone.js、React.js、Ember.js、Avalon.js、Vue.js 概念摘录
注:文章内容都是摘录性文字,自己阅读的一些笔记,方便日后查看. MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是 ...
随机推荐
- IIS7错误:“Web服务器被配置为不列出此目录的内容”的解决办法
IIS7错误:“Web服务器被配置为不列出此目录的内容”的解决方法: 在"操作"下,点启用,此按钮将变成禁用,则可消除此错误
- Install Package and Software
svn http://tortoisesvn.sourceforge.net/ git https://download.tortoisegit.org/ http://git-for-windows ...
- C++中的类访问控制
C++中 public,protected, private 访问标号小结 第一:private, public, protected 访问标号的访问范围. private:只能由1.该类中的函数.2 ...
- 关于EF中ApplyCurrentValues和ApplyOriginalValues区别
关于EF中ApplyCurrentValues和ApplyOriginalValues区别:两者都是编辑数据时使用. // // 摘要: // 将 System.D ...
- C# - 系统类 - String类
String类 ns:System String类封装了一系列不能被改变的Unicode字符序列 字符属于引用类型 但它又具有值类型的行为 固定不变意味着 一旦在托管堆中分配了一块内存来存储字符 字符 ...
- 10465 - Homer Simpson 贪心
Homer Simpson Time Limit: 3 seconds Memory Limit: 32 MB Home ...
- WPF柱状图(支持数据库动态更新)之组件的数据动态化
WPF柱状图(支持数据库动态更新) 在这片文章中我们介绍了如何将柱状图包装成一个组件,将这个组件的属性对外开放和组件的外部属性根内部属性绑定以及非轮询动态更新数据的方式. 非轮询更新数据感觉介绍的不够 ...
- Android(java)学习笔记209:采用get请求提交数据到服务器(qq登录案例)
1.GET请求: 组拼url的路径,把提交的数据拼装url的后面,提交给服务器. 缺点:(1)安全性(Android下提交数据组拼隐藏在代码中,不存在安全问题) (2)长度有限不能超过4K(h ...
- Android(java)学习笔记141:SQLiteDatabase的query方法参数分析
public Cursor query (boolean distinct, String table, String[] columns, String selection, String[] se ...
- CentOS7使用VPN上网
安装epel源 $ sudo yum install epel-release 安装软件包 $ sudo yum install NetworkManager-pptp NetworkManager- ...