首页 > 代码库 > $http学习记录

$http学习记录

火狐的网址可以直接写文件的地址 如:D:\studyprogram\wamp\www\http.html

其他的要改成服务器下的地址  如 http://localhost\http.html

废弃声明 (v1.5)

v1.5 中$http 的 success 和 error 方法已废弃。使用 then 方法替代。

 以下代码 angularjs 版本1.6.4

1.txt

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

$http通用

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <meta charset="utf-8">
 5 <script src="angular.min.js"></script>
 6 </head>
 7 <body>
 8 
 9 <div ng-app="myApp" ng-controller="contl"> 
10 
11 <ul>
12   <li ng-repeat="x in names">
13     {{ x.Name + ‘, ‘ + x.Country }}
14   </li>
15 </ul>
16 
17 </div>
18 
19 <script>
20 var app = angular.module(myApp, []);
21     
22 app.controller(contl, function($scope, $http) {
23     $http({
24          method: GET,
25          url:"1.txt"
26     }).then(function success(response) {
27             $scope.names = response.data.sites;
28         },function (response) {
29             //失败了执行
30         });
31 });
32     </script>
33 
34 </body>
35 </html>

get简写

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <meta charset="utf-8">
 5 <script src="angular.min.js"></script>
 6 </head>
 7 <body>
 8 
 9 <div ng-app="myApp" ng-controller="contl"> 
10 
11 <ul>
12   <li ng-repeat="x in names">
13     {{ x.Name + ‘, ‘ + x.Country }}
14   </li>
15 </ul>
16 
17 </div>
18 
19 <script>
20 var app = angular.module(myApp, []);
21     
22 app.controller(contl, function($scope, $http) {
23     $http.get("1.txt",).then(function (response) {
24             $scope.names = response.data.sites;
25         },function (response) {
26             //失败了执行
27         });
28 });
29     </script>
30 
31 </body>
32 </html>

a.php

1 <?php
2 echo $_GET[‘a‘]+$_GET[‘b‘];
3 ?>

带参数的

 1 <!doctype html>
 2 <html ng-app="test">
 3 <head>
 4 <meta charset="utf-8">
 5 <title>无标题文档</title>
 6 <script src="angular.min.js"></script>
 7 <script>
 8 var app=angular.module(test, []);
 9 
10 app.controller(cont1, function ($scope, $http){
11     $http.get(a.php, {
12         params: {a: 12, b: 5}
13     }).then(function (response){
14         alert(response.data);
15     }, function (){
16         alert(失败了);
17     });
18 });
19 </script>
20 </head>
21 
22 <body ng-controller="cont1">
23 </body>
24 </html>
$http.jsonp(‘some/trusted/url‘, {jsonpCallbackParam: ‘callback‘})

您还可以在其中指定默认的回调参数名称最初设置为$http.defaults.jsonpCallbackParam‘callback‘

不能再使用JSON_CALLBACK字符串作为占位符来指定回调参数值应该在哪里。

没有找到好的相关例子。。。。

$http学习记录