首頁 > web前端 > js教程 > angularJS實作$http.post和$http.get請求的程式碼詳解

angularJS實作$http.post和$http.get請求的程式碼詳解

Y2J
發布: 2017-05-22 13:29:55
原創
1797 人瀏覽過

本篇文章主要介紹了angularJS 發起$http.post和$http.get請求的實作方法,分別介紹了$http.post和$http.get請求的方法,有興趣的可以了解一下

AngularJS發起$http.post請求

程式碼如下:

$http({ 
  method:'post', 
  url:'post.php', 
  data:{name:"aaa",id:1,age:20} 
}).success(function(req){ 
  console.log(req); 
})
登入後複製

這時候你會發現收不到回傳的數據,結果是null,這是因為要轉換成form data。

解決方案:

設定$httpProvider:

var myApp = angular.module('app',[]); 
 myApp.config(function($httpProvider){ 

  $httpProvider.defaults.transformRequest = function(obj){ 
   var str = []; 
   for(var p in obj){ 
    str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p])); 
   } 
   return str.join("&"); 
  } 

  $httpProvider.defaults.headers.post = { 
    'Content-Type': 'application/x-www-form-urlencoded' 
  } 

});
登入後複製

或在post中設定:

$http({ 
  method:'post', 
  url:'post.php', 
  data:{name:"aaa",id:1,age:20}, 
  headers:{'Content-Type': 'application/x-www-form-urlencoded'}, 
  transformRequest: function(obj) { 
   var str = []; 
   for(var p in obj){ 
    str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p])); 
   } 
   return str.join("&"); 
  } 
}).success(function(req){ 
    console.log(req); 
})
登入後複製

AngularJS發起$http. post請求

程式碼如下:

  app.controller('sprintCtrl', function($scope, $http) {
      $http.get("http://localhost:8080/aosapp/pt/service?formid=pt_aosapp_service_sprintlist&teamid=1")
      .success(function (response) {console.log($scope.sprintlist=response);});
    });
登入後複製

其實,angularjs 和jquery js最大的區別在哪裡那,angularjs是你事先在心中建構好真個頁面,然後用變數或佔位符來表示數據,數據來了,直接填充就可以了;而jquery則是動態的修改dom元素,如添加修改dom標籤等。設計思想不一樣。

【相關推薦】

1. Javacript免費影片教學

2. js開發用到百度地圖的程式碼整理

3. 使用node.js分析url輸出檔案給客戶端​​

4. JavaScript解決漢字轉拼音的實例詳解

5. 分享15個常用的js正規表示式

#

以上是angularJS實作$http.post和$http.get請求的程式碼詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板