转自:https://www.cnblogs.com/best/tag/Angular/

$http 是 AngularJS 中的一个核心服务,用于读取远程服务器的数据。

使用格式:

// 简单的 GET 请求,可以改为 POST
$http({
    method: 'GET',
    url: '/someUrl'
}).then(function successCallback(response) {
        // 请求成功执行代码
    }, function errorCallback(response) {
        // 请求失败执行代码
});

简写方法

POST 与 GET 简写方法格式:

$http.get('/someUrl', config).then(successCallback, errorCallback);
$http.post('/someUrl', data, config).then(successCallback, errorCallback);

此外还有以下简写方法:

  • $http.get
  • $http.head
  • $http.post
  • $http.put
  • $http.delete
  • $http.jsonp
  • $http.patch

更详细内容可参见:

读取 JSON 文件

以下是存储在web服务器上的 JSON 文件:

 {
"sites": [
{
"Name": "菜鸟教程",
"Url": "www.runoob.com",
"Country": "CN"
},
{
"Name": "Google",
"Url": "www.google.com",
"Country": "USA"
},
{
"Name": "Facebook",
"Url": "www.facebook.com",
"Country": "USA"
},
{
"Name": "微博",
"Url": "www.weibo.com",
"Country": "CN"
}
]
}

2.

 <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.bootcss.com/angular.js/1.6.3/angular.min.js"></script>
</head>
<body> <div ng-app="myApp" ng-controller="siteCtrl"> <ul>
<li ng-repeat="x in names">
{{ x.Name + ', ' + x.Country }}
</li>
</ul> </div> <script>
var app = angular.module('myApp', []); app.controller('siteCtrl', function($scope, $http) {
$http({
method: 'GET',
url: 'http://www.runoob.com/try/angularjs/data/sites.php'
}).then(function successCallback(response) {
$scope.names = response.data.sites;
}, function errorCallback(response) {
// 请求失败执行代码
}); });
</script> </body>
</html>

3.

简写方法实例

 <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.bootcss.com/angular.js/1.6.3/angular.min.js"></script>
</head>
<body> <div ng-app="myApp" ng-controller="siteCtrl"> <ul>
<li ng-repeat="x in names">
{{ x.Name + ', ' + x.Country }}
</li>
</ul> </div> <script>
var app = angular.module('myApp', []);
app.controller('siteCtrl', function($scope, $http) {
$http.get("http://www.runoob.com/try/angularjs/data/sites.php")
.then(function (response) {$scope.names = response.data.sites;});
});
</script> </body>
</html>

4.

AngularJS1.5 以下版本 - 实例

 
 <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body> <div ng-app="myApp" ng-controller="siteCtrl"> <ul>
<li ng-repeat="x in names">
{{ x.Name + ', ' + x.Country }}
</li>
</ul> </div> <script>
var app = angular.module('myApp', []);
app.controller('siteCtrl', function($scope, $http) {
$http.get("http://www.runoob.com/try/angularjs/data/sites.php")
.success(function (response) {$scope.names = response.sites;});
});
</script> </body>
</html>

43.$http的更多相关文章

  1. redhat6下安装Lighttpd1.4.43

    学完了C语言,自信满满地冲着开源软件去了,首选了Lighttpd,这个软件代码量不多,适合初入开源的朋友 redhat下安装Lighttpd,一定要先安装依赖库,pcre和bzip2,这两个自行下载, ...

  2. IOS开发基础知识--碎片43

    1:增加手势进行左划效果,针对视图并修改其中一个的坐标,菜单用隐藏跟显示 @property(strong,nonatomic)UISwipeGestureRecognizer *recognizer ...

  3. L440 无线网卡:由于该设备有问题,Windows 已将其停止(代码 43)

    最近重装了系统,本来用的好好的,结果重启之后突然无线网卡不能用了,设备管理器老是黄色叹号!无线网卡设备状态:由于该设备有问题,Windows 已将其停止. (代码 43).      无线网卡型号:2 ...

  4. AC日记——质因数分解 1.5 43

    43:质因数分解 总时间限制:  1000ms 内存限制:  65536kB 描述 已知正整数 n 是两个不同的质数的乘积,试求出较大的那个质数. 输入 输入只有一行,包含一个正整数 n. 对于60% ...

  5. BestCoder Round #43

    T1:pog loves szh I(hdu 5264) 题目大意: 给出把AB两个字符串交叉拼起来的结果,求出原串. 题解: 不解释..直接每次+2输出. T2:pog loves szh II(h ...

  6. rtabmap_ros安装---43

    摘要: 原创博客:转载请标明出处:http://www.cnblogs.com/zxouxuewei/ 一.前言 RTAB-Map (Real-Time Appearance-Based Mappin ...

  7. c++ primer 5th 练习3.43

    #include <iostream> using namespace std; int main() { ][]={,,,,,,,,,,,}; /* for(int (&i)[4 ...

  8. Sqli-labs less 43

    Less-43 本关与42关的原理基本一致,我们还是定位在login.php中的password.看一下sql语句为: $sql = "SELECT * FROM users WHERE u ...

  9. 出现错误:Unable to load configuration. - action - file:/E:/Java/Tomcat7.0/apache-tomcat-7.0.68-windows-x64/apache-tomcat-7.0.68/webapps/SSH2Integrate/WEB-INF/classes/struts.xml:8:43

    严重: Exception starting filter struts2 Unable to load configuration. - action - file:/E:/Java/Tomcat7 ...

  10. [每日一题] 11gOCP 1z0-053 :2013-10-11 Flashback Data Archive属性.........................43

    转载请注明出处:http://blog.csdn.net/guoyjoe/article/details/12656897 正确答案:BD 闪回数据归档请参考:http://blog.csdn.net ...

随机推荐

  1. HDU 4165

    一块药看成括号配对就行了.很明显的直接求卡特兰数. 今晚看了HDU 3240的题,有一点思路,但无情的TLE.想不到什么好方法了,看了别人的解答,哇...简直是天才的做法啊....留到星期六自己思考一 ...

  2. iipccsxxtnsoiq

    gxspvyheuetwqgnbwmwd

  3. shell脚本学习之ubuntu删除多余内核

    #!/bin/bash #定期删除内核 #存储命令输出cmd_output=`commands` uname_output=$(uname -r) kernel_output=`dpkg --list ...

  4. 叫号系统排队系统挂号系统实现(JAVA队列)

    关于队列,使用的地方很的多. 现实中有许多的样例. 比方医院的挂号系统,银行里的叫号系统,食堂里的排队打饭等等.市场上又这种排队取号的设备.他们的功能基本例如以下: 1.系统可联网联机统一发号.2.系 ...

  5. Java5新特性之枚举

    1.  概念 首先,枚举并非一种新技术,而是一种基础数据类型.它隶属于两种基础类型中的值类型,例如以下: 2.  为什么要有枚举 枚举在真正的开发中是非经常常使用的,它的作用非常easy也非常纯粹:它 ...

  6. 110个经常使用Oracle函数总结

    1. ASCII 返回与指定的字符相应的十进制数; SQL> select ascii(A) A,ascii(a) a,ascii(0) zero,ascii( ) space from dua ...

  7. 2015多校联合训练赛hdu 5301 Buildings 2015 Multi-University Training Contest 2 简单题

    Buildings Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 131072/131072 K (Java/Others) Tota ...

  8. Ext4,Ext3的特点和区别

    Linux kernel 自 2.6.28 开始正式支持新的文件系统 Ext4. Ext4 是 Ext3 的改进版,修改了 Ext3 中部分重要的数据结构,而不仅仅像 Ext3 对 Ext2 那样,只 ...

  9. vue平行组件传值 params

    欢迎加入前端交流群交流知识&&获取视频资料:749539640 需要传值的组件组件: <template> <div> <router-link :to= ...

  10. BootStrap学习(二)——重写首页之topbar

    1.布局容器 帮助文档:http://v3.bootcss.com/css/#overview-container BootStrap需要为页面内容和栅栏系统包裹一个.container容器.提供的两 ...