AngularJS中$http使用的簡(jiǎn)單介紹
在AngularJS中主要使用$http服務(wù)與遠(yuǎn)程http服務(wù)器交互,其作用類似于jquery中的$.ajax服務(wù):
- $http是AngularJS的一個(gè)核心服務(wù),利用瀏覽器的xmlhttprequest或者via JSONP對(duì)象與遠(yuǎn)程HTTP服務(wù)器進(jìn)行交互;
- 與$.ajax相同,支持多種method請(qǐng)求:get、post、put、delete等;
- controller中可通過與$scope同樣的方式獲取$http對(duì)象,形如:function controller($ http, $ scope){};
$http使用說明:
$http服務(wù)使用如下面代碼所示:
// 1.5以下版本
$http(config)
.success(function(data, status, headers, config){//請(qǐng)求成功執(zhí)行代碼})
.error(function(data, status, headers, config){//請(qǐng)求失敗執(zhí)行代碼})
// 1.5以上版本
$http(config).then(
function successCallback(response){//請(qǐng)求成功執(zhí)行代碼},
function errorCallback(response){//請(qǐng)求失敗執(zhí)行代碼}
);
具體參數(shù)、方法說明:
配置參數(shù):
- config是請(qǐng)求的配置參數(shù)總集,格式為json;
- 包含的配置項(xiàng)包括:
- method:字符串類型,請(qǐng)求方式如"GET","POST","DELETE"等;
- url:字符串類型,請(qǐng)求的url地址;
- params:json類型,請(qǐng)求參數(shù),將在url上被拼接成?key=value的形式;
- data:json類型,請(qǐng)求數(shù)據(jù),將放在請(qǐng)求內(nèi)發(fā)送至服務(wù)器;
- cache:bool類型,true表示http GET請(qǐng)求時(shí)采用默認(rèn)的$http cache,否則使用$cacheFactory的實(shí)例;
- timeout:整數(shù)類型,超時(shí)時(shí)間;
回調(diào)函數(shù):
- success是請(qǐng)求成功后的回調(diào)函數(shù);
- error是請(qǐng)求失敗后的回調(diào)函數(shù);
- data是響應(yīng)體;
- status是相應(yīng)的狀態(tài)值;
- headers是獲取getter的函數(shù);
- config是請(qǐng)求中的config json對(duì)象;
method屬性可以作為config配置參數(shù)中的一個(gè)屬性,也可以直接作為方法調(diào)用,如:
$http.post(url, data, config)
$http使用范例:
var searchOplog = function ($http, table, btn) {
$http({
url: 'data/oplog.json',
method: 'GET'
}).then(function successCallback(response) {
console.log('get Oplog success:', response);
table.init(response.data);
btn.button('reset');
btn.dequeue();
}, function errorCallback(response) {
console.log('errorCallback Response is:', response);
table.init();
btn.button('reset');
btn.dequeue();
});
};
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
angular內(nèi)置provider之$compileProvider詳解
下面小編就為大家?guī)硪黄猘ngular內(nèi)置provider之$compileProvider詳解。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-09-09
AngularJS使用angular.bootstrap完成模塊手動(dòng)加載的方法分析
這篇文章主要介紹了AngularJS使用angular.bootstrap完成模塊手動(dòng)加載的方法,結(jié)合實(shí)例形式分析了angular.bootstrap函數(shù)手動(dòng)加載模塊的步驟與相關(guān)操作技巧,需要的朋友可以參考下2017-01-01
使用AngularJS實(shí)現(xiàn)可伸縮的頁(yè)面切換的方法
這篇文章主要介紹了使用AngularJS實(shí)現(xiàn)可伸縮的頁(yè)面切換的方法,AngularJS是一款熱門的JavaScript庫(kù),需要的朋友可以參考下2015-06-06
Angular進(jìn)行簡(jiǎn)單單元測(cè)試的實(shí)現(xiàn)方法實(shí)例
這篇文章主要給大家介紹了關(guān)于Angular進(jìn)行簡(jiǎn)單單元測(cè)試的實(shí)現(xiàn)方法,文中僅用了幾行代碼,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家學(xué)習(xí)或者使用Angular具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧2020-08-08
AngularJS中的$parse服務(wù)與$eval服務(wù)用法實(shí)例
這篇文章主要介紹了AngularJS中的$parse服務(wù)與$eval服務(wù)用法,結(jié)合實(shí)例形式分析了AngularJS中$parse服務(wù)與$eval服務(wù)的功能、使用方法與相關(guān)注意事項(xiàng),需要的朋友可以參考下2023-05-05
AngularJS頁(yè)面帶參跳轉(zhuǎn)及參數(shù)解析操作示例
這篇文章主要介紹了AngularJS頁(yè)面帶參跳轉(zhuǎn)及參數(shù)解析操作,結(jié)合具體實(shí)例形式分析了AngularJS使用URL傳遞參數(shù)及參數(shù)的接收、解析等相關(guān)操作技巧,需要的朋友可以參考下2017-06-06
Angular應(yīng)用里環(huán)境變量SERVER_REQUEST_ORIGIN含義解析
這篇文章主要為大家介紹了Angular應(yīng)用里環(huán)境變量SERVER_REQUEST_ORIGIN的含義解析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-10-10

