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( ...
随机推荐
- GIL解释器,协程,gevent模块
GIL解释器锁 在Cpython解释器中,同一个进程下开启的多线程,同一时刻只能有一个线程执行,无法利用多核优势 首先需要明确的一点是GIL并不是Python的特性,它是在实现Python解析器(CP ...
- 转:C#访问修饰符
http://www.cnblogs.com/netlyf/archive/2009/12/13/1623103.html
- iptables打开22,80,8080,3306等端口
systemctl stop firewalld systemctl mask firewalld Then, install the iptables-services package: yum i ...
- Codeforces Round #395 (Div. 2) C. Timofey and a tree
地址:http://codeforces.com/contest/764/problem/C 题目: C. Timofey and a tree time limit per test 2 secon ...
- C++中的config设计
配置文件读写类,它要有以下这些方法: 1. 支持读入一个指定配置文件的能力 2. 支持随时加入一个配置项的能力 3. 足够强大,能够写入各种数据结构的配置信息 C++ 里,我们要存储这样的数据就使用 ...
- 微信小程序:其中wxml和wxss的样式说明
微信小程序:其中wxml和wxss的样式说明 一.简介 对于css不熟悉的Android程序员来说,开发微信小程序面临的一个比较困难的问题就是界面的排版了.微信小程序的排版就跟wxml和wxss有关了 ...
- python_初步
官网地址:http://www.python.org/ Python最新源码,二进制文档,新闻资讯 Python文档下载地址:www.python.org/doc/ python教程:http://w ...
- linux驱动调试--修改系统时钟终端来定位僵死问题【转】
本文转载自:http://blog.chinaunix.net/uid-20671208-id-4940381.html 原文地址:linux驱动调试--修改系统时钟终端来定位僵死问题 作者:枫露清愁 ...
- Mysql 常用单词
单词: CRUD:增删改查(create/read/update/delete) create:新增项目 read:查询 update:修改 delete:删除 desc 表名:查看表结构 drop: ...
- LeetCode——Hamming Distance
LeetCode--Hamming Distance Question The Hamming distance between two integers is the number of posit ...