转自: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. nodejs是一个平台,是平台

    node.js是用javascript来写服务器代码的平台

  2. Intellij idea 自动完成的变量名称首字母变为小写

    Intellij idea 自动完成的变量名称首字母变为小写 好像没有什么好的自动办法,自己输入一个小写的字母吧,然后Idea会出提示.

  3. _00017 Kafka的体系结构介绍以及Kafka入门案例(0基础案例+Java API的使用)

    博文作者:妳那伊抹微笑 itdog8 地址链接 : http://www.itdog8.com(个人链接) 博客地址:http://blog.csdn.net/u012185296 博文标题:_000 ...

  4. Android 输入管理服务-输入事件向详细应用的分发

    输入管理服务接收到输入事件,对输入事件进行处理之后会把输入事件分发到详细的应用中(如WMS.壁纸服务等)去处理的,这里涉及到了JNI从C++层向JAVA层的调用. 详细流程例如以下图所看到的:

  5. 日常问题记录-- java.lang.IllegalArgumentException: taglib definition not consistent with specification version

    转自:https://www.cnblogs.com/carterzhang/p/4288650.html 背景: tomcat8.0中使用taglib 错误表现: java.lang.Illegal ...

  6. xBIM 高级03 更改日志创建

    系列目录    [已更新最新开发文章,点击查看详细]  模型中发生的每一个变化都是事务的一部分,这是我们设计的核心.所有事务都是由 IModel 的实现创建的,并且从中被弱引用,因此当使用 using ...

  7. 模仿百度首页“元宵节汤圆”动图(js的定时任务:setInterval)

    模仿百度首页“元宵节汤圆”动图:(js的定时任务:setInterval) 原理:需要一张切图,通过不断定位使得图片就像一帧一帧的图片在播放从而形成了动画 效果图: 切图地址: https://ss1 ...

  8. (转)script标签到底该放在哪里

    一般script标签会被放在头部或尾部.头部就是<head>里面,尾部一般指<body>里[4-5]. 将script放在<head>里,浏览器解析HTML,发现s ...

  9. bioinformaitcs的latex版本参考文献填坑

    最近实验室投bioinfomatics的刊,编辑说要把参考文献的格式改成不带方括号的,而且加点,而且只保留前三作者,之后用et al. 折腾了一下午,终于弄出来了. 首先,导言区需要添加: \make ...

  10. 从 MVC 到微服务,技术演变的必经之路

    架构模式演进 CGI 模式 图 1 CGI 出现于 1993 年,图 1 是 CGI 模式比较简单的结构图. MVC 模式 开源电商软件等都是采用 MVC 模式,MVC 模式是做软件开发必学和必经历的 ...