<!DOCTYPE html>
<html lang="en" ng-app='myApp'>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body ng-controller='mainController'>
<script src="angular.js"></script>
<script>
angular.module('myApp',).controller('mainController',['$scope','$http',function($scope,$http,$scope){
$http.get('api/1.php').success(function(data,status,headers,config){
console.log(data)
}).error(function(data,status,headers,config){
});
}]);
</script>
</body>
</html>
$http作為ng的一個重要的service忘分,它有下面這些方法:
<script>
$http({
method:string,//有GET,POST,DELETE,PUT,JSONP
url:string,
params:string,
data:string or object,
header:object,
transformRequest:
transformResponse:
cache:
timeout:
withCreditials:
})
</script>
$http默認的headers有:Accept:application/json,text/plain當然诺凡,你可以把默認的的header改一下:
<!DOCTYPE html>
<html lang="en" ng-app='myApp'>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body ng-controller='mainController'>
<script src="angular.js"></script>
<script>
angular.module('myApp',)
.config(['$httpProvider', function($httpProvider) {
$httpProvider.defaults.headers.common["X-Requested-With"] = 'XMLHttpRequest';
}])
.controller('mainController',['$scope','$http',function($scope,$http,$scope){
$http.get('api/1.php').success(function(data,status,headers,config){
console.log(data)
}).error(function(data,status,headers,config){
})
}]);
</script>
</body>
</html>
ef7caa6931c63016be34a40662f1c105.png
我們可以用transformRequest方法將響應進行轉換:
<!DOCTYPE html>
<html lang="en" ng-app='myApp'>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body ng-controller='mainController'>
<script src="jquery-1.11.3.js"></script>
<script src="angular.js"></script>
<script>
angular.module('myApp',)
.config(['$httpProvider', function($httpProvider) {
$httpProvider.defaults.headers.common["X-Requested-With"] = 'XMLHttpRequest';
$httpProvider.defaults.transformRequest = function(data){
// console.log($.param)
return $.param(data);
};
}])
.controller('mainController',['$scope','$http',function($scope,$http,$scope){
$http.get('api/1.php',{params:{id:4,name:'moyu'}}).success(function(data,status,headers,config){
console.log(data)
}).error(function(data,status,headers,config){
})
}]);
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en" ng-app='myApp'>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body ng-controller='mainController'>
<script src="jquery-1.11.3.js"></script>
<script src="angular.js"></script>
<script>
angular.module('myApp',[])
.config(['$httpProvider', function($httpProvider) {
$httpProvider.defaults.headers.common["X-Requested-With"] = 'XMLHttpRequest';
// $httpProvider.defaults.transformRequest = function(data){
// // console.log($.param)
// return $.param(data);
// };
}])
.controller('mainController',['$scope','$http',function($scope,$http,$scope){
$http
.get('api/1.php',{params:{id:4,name:'moyu'}})
.then(function successCb(data){console.log(data)},function errorCb(data){console.log(data)});
}]);
</script>
</body>
</html>
如果你們后臺給力谐宙,可以嘗試用$resource或restangular實現(xiàn)resuful
<!DOCTYPE html>
<html lang="en" ng-app='myApp'>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body ng-controller='mainController'>
<script src="underscore.js"></script>
<script src="angular.js"></script>
<script src="restangular.js"></script>
<script>
angular
.module('myApp',['restangular'])
.controller('mainController',['Restangular','$scope',function(Restangular,$scope){
console.log(Restangular.all('users.php'))
}])
</script>
</body>
</html>