ng $http 和远程服务器通信的一个服务。
$http({url:'',method:''}).success().error()
简洁写法:
$http.get()
$http.post()
...
注意事项:
①要求返回的数据格式是json格式
②在发起post请求时,如果需要传参
$http.post('url',data),需要设置请求头:
$http.defaults.headers.post = {'Content-Type':'application/x-www-form-urlencoded'};
全局设置请求头:
app.run(function($http){
$http.defaults.headers.post = {'Content-Type':'application/x- www-form-urlencoded'};})
例子:
点击按钮,发起get请求,服务器接收数据返回给客户端,将返回的结果显示出来
发送:name='zhangsan'
返回:json格式字符串
tip:welcome zhangsan
<!DOCTYPE html>
<html ng-app="myApp">
<head lang="en">
<meta charset="UTF-8">
<script src="js/angular.js"></script>
<title></title>
</head>
<body>
<div ng-controller="myCtrl">
<button ng-click="getData()">
get请求
</button>
<ul>
<li ng-repeat="tmp in list">
{{"name is "+tmp.name+" age is "+tmp.age}}
</li>
</ul>
</div>
<script>
var app = angular.module('myApp', ['ng']);
app.controller('myCtrl',
function ($scope,$http) {
$scope.list = [];
$scope.getData = function () {
$http
.get('data/test.json')
.success(function (result) {
$scope.list = result;
})
.error(function () {
console.log(arguments);
})
}
})
</script>
</body>
</html>
其中 test.json:
[
{
"name":"Lucy",
"age":20
},
{
"name":"Lily",
"age":21
},
{
"name":"Mary",
"age":23
}
]
2.
<!DOCTYPE html>
<html ng-app="myApp">
<head lang="en">
<meta charset="UTF-8">
<script src="js/angular.js"></script>
<title></title>
</head>
<body>
<div ng-controller="myCtrl">
<button ng-click="postData()">
获取信息
</button>
<span>{{msg.tip}}</span>
</div>
<script>
var app = angular.module('myApp', ['ng']); //全局设置 post请求头
//app.config 需要用到provider
//app.run app.run(function ($http) {
$http.defaults.headers.post = {
'Content-Type':
'application/x-www-form-urlencoded'
}}
); app.controller('myCtrl',
function ($scope,$http,$httpParamSerializerJQLike) {
$scope.postData = function () {
var user =
{name:'zhangsan',age:20,score:90};
var result =
$httpParamSerializerJQLike(user);
console.log(result);
$http
.post('data/test.php',result)
.success(function (data) {
console.log(data);
$scope.msg = data;
})
}
})
</script>
</body>
</html>
其中test.php:
<?php
header("Content-Type:application/json");
@$name = $_REQUEST['name'];
$result = [];
$result = [
'tip'=> 'welcome '.$name
];
echo json_encode($result);
?>
ng $http 和远程服务器通信的一个服务。的更多相关文章
- 使用VISIO远程服务器上的ORACLE数据库,反向生成数据库实体关系图
反向即根据已有的数据库,生成ER图,很多工具都可以实现这一过程,如visio,powerdesigner等,下面文章记录一下我使用VISIO生成远程服务器上的一个数据库ER图过程,供以后自己参考. 1 ...
- Maven部署web应用到远程服务器
Maven部署web应用到远程服务器 找到了一个很详细的地址:http://www.mkyong.com/maven/how-to-deploy-maven-based-war-file-to-tom ...
- 关于nagios监控远程服务器对服务器性能影响的测试
1. Nagios监视远程服务器时,是通过在控制端执行以下命令进行数据收集的: /usr/local/nagios/libexec/check_http -I 192.168.16.11 /us ...
- ORA-12538;ORA-12154;使用PL/SQL dve无法连接远程服务器上的oracle数据库,同时本机上也安装了一个oracle数据库
问题描述:本人使用PL/SQL dve连接远程服务器上的oracle数据库,一直是没有问题的.我想提高下自己在数据库方面的能力就在自己的笔记本上安装了一个oracle数据库实例,安装并配置好之后,使用 ...
- git本地创建一个分支并上传到远程服务器上
git branch 查看分支 新建分支:git checkout -b dev 把新建的本地分支push到远程服务器 git push origin 本地名字:外地名字 删除远程分支 git pus ...
- android-数据存储之远程服务器存储
一.如何编码实现客户端与服务器端的交互 <一>JDK内置原生API HttpUrlConnection <二>Android内置的包装API HttpClient浏览器 < ...
- 解放双手:如何在本地调试远程服务器上的Node代码
写在前面 谈到node断点调试,目前主要有三种方式,通过node内置调试工具.通过IDE(如vscode).通过node-inspector,三者本质上差不多.本文着重点在于介绍 如何在本地通过nod ...
- Linux 笔记 #03# 在 Debian远程服务器上运行 Java socket程序
我试图做什么:把我的破代码放到服务器上运行,并成功与客户端进行 socket通信. 预备环境:刚安装好 MySQL 和 JVM 的 Linux远程服务器(Debian 8)一台. 主要有如下几个步骤: ...
- AngularJs 与服务器通信 $http, $q, $resource
$http服务是AngularJS系统自带的,可以用来进行网络通信.获取远程服务器的数据.要记住的是,$http是对浏览器XMLHttpRequest的封装,也就是说,它其实是Ajax. $http( ...
随机推荐
- beego——错误处理
beego通过Redirect方法来进行跳转: func (this *AddController) Get() { this.Redirect("/", 302) } 如何终止此 ...
- 我们为什么使用ORM
我们为什么使用ORM? http://www.cnblogs.com/tansm/archive/2006/06/07/419927.html 博客园在推广ORM方面的确做了很大的贡献,很多的程序员开 ...
- SQLAlchemy_定义(一对一/一对多/多对多)关系
目录 Basic Relationship Patterns One To Many One To One Many To Many Basic Relationship Patterns 基本关系模 ...
- jmeter之报告和分析
转载:http://www.cnblogs.com/miaomiaokaixin/p/6118081.html jmeter -n -t 脚本名字.jmx -l xxx.jtl -e -o 指定目录( ...
- 一个linux命令(6/12):cat 命令
cat主要有三大功能:1.一次显示整个文件.$ cat filename2.从键盘创建一个文件.$ cat > filename 只能创建新文件,不能编辑已有文件.3.将几个文件合并为一 ...
- react native 之异步请求
第一章 异步请求 fetch的运用 在react native 中异步请求一般用fetch这个方法, fetch的格式如下: const params ={ "charset" ...
- Ctrl+Z 暂停程序及重启程序【转】
本文转自:https://blog.csdn.net/duyiwuer2009/article/details/43191799 Ctrl+Z - 暂停进程并放入后台 jobs - 显示当前暂停的进程 ...
- ES6 实现阶乘
// 实现一个5的阶乘function factorial(n, acc = 1) { console.log(`n=${n};acc=${acc}`) if(n <= 1) return ac ...
- fabric动态获取远程目录列表
#!/usr/bin/pythonfrom fabric.api import *env.user='root'env.hosts=['172.10.224.183','172.10.224.132' ...
- LeetCode——Max Consecutive Ones
LeetCode--Max Consecutive Ones Question Given a binary array, find the maximum number of consecutive ...