AngularJs的基础——$http请求数据

 

AngularJs的基础——$http请求数据[收藏]

标签： angularjs
2015-12-29 16:46 2538人阅读 评论(0) 收藏 举报
 分类：

版权声明：本文为博主原创文章，未经博主允许不得转载。

$http请求数据主要会有以下三种方式

1.get请求

2.post请求

3.jsonp

 

[html] view plain copy
 
 在CODE上查看代码片派生到我的代码片
  1. <!DOCTYPE html>  
  2. <html lang="zh_CN">  
  3. <head>  
  4.     <meta charset="UTF-8">  
  5.     <title>Angular基础</title>  
  6. </head>  
  7. <body>  
  8. <div ng-app="myApp">  
  9.     <div ng-controller="personCtrl">  
  10.         姓：<input type="text" ng-model="firstName"/><br/>  
  11.         名：<input type="text" ng-model="lastName"/><br/>  
  12.         姓名：<span ng-bind="firstName"></span><span ng-bind="lastName"></span>  
  13.     </div>  
  14.   
  15. </div>  
  16. <script src="angular.min.js"></script>  
  17. <script type="application/javascript">  
  18.     var myApp=angular.module('myApp',[]);  
  19.     myApp.controller('personCtrl',function($scope,$http){  
  20.         $http.get('getData.php').  
  21.                 success(function(data) {  
  22.                     console.log(data);  
  23.                 }).  
  24.                 error(function(err) {  
  25.                     //错误代码  
  26.                 });  
  27.         //$http.post采用postJSON方式发送数据到后台，  
  28.         // 解决办法：在后台php中使用$postData=file_get_contents("php://input",true);这样就可以获得前端传送过来的数据  
  29.         var postData={msg:'post的内容'};  
  30.         var config={params:{id:'5',name:'张三丰'}};  
  31.         $http.post('postData.php', postData,config).  
  32.                 success(function(data) {  
  33.                     console.log(data);  
  34.                 }).  
  35.                 error(function(err) {  
  36.                     //错误代码  
  37.                 });  
  38.         var myUrl ="http://www.phonegap100.com/appapi.php?a=getPortalList&catid=20&page=1&callback=JSON_CALLBACK";  
  39.         $http.jsonp(myUrl).success(  
  40.                 function(data){  
  41.                     console.log(data);  
  42.                 }  
  43.         ).error(function(err){  
  44.                    //错误代码  
  45.                 });  
  46.         $scope.firstName="Wang";  
  47.         $scope.lastName="Ben";  
  48.     });  
  49.   
  50.   
  51. </script>  
  52. </body>  
  53. </html>  

[php] view plain copy
 
 在CODE上查看代码片派生到我的代码片
  1. <?php  
  2. //getData.php文件  
  3. echo 'hello';  
[php] view plain copy
 
 在CODE上查看代码片派生到我的代码片
  1. <?php  
  2. //postData.php文件  
  3.   
  4. //用接收json数据的方式  
  5. $msg=file_get_contents("php://input",true);  
  6.   
  7. $name=$_GET['name'];  
  8. echo $name.$msg."_post";  
显示效果：

 

posted @ 2017-03-24 13:59  路人Monody  阅读(133)  评论(0)  编辑  收藏  举报