dkplus.jpg

正所謂“人在江湖，身不由己”，在開發(fā)之路上前端少俠dk遇到過種種困難，尤其在與后端進行數據對接的時候，不得不逼迫自己以極快的速度去學習和掌握一些奇招怪式，正當他以為就憑一個原生的ajax請求便能對所有數據對接問題迎刃而解之際，更大的問題來了……

這時候，樟哥再一次語重心長地說道：小伙，去找本ng秘笈看看吧，學會$http神功便能配合我進行數據大挪移！
如果我沒聽錯，ng秘笈、$http這特么又是什么鬼新名詞??！

于是，我再一次接受樟哥的建議，在菜鳥教程上打聽到了ng秘笈。

經過兩天兩夜的苦心鉆研，我把整本ng秘笈粗略的翻了一遍，對ng神功有了大概的了解：這特么就是把js降龍十八掌十八式合成一掌一式一招致命嘛，練不好的話很容易走火入魔滴?。?/p>

好了，該說點正經事了，什么是ng神功呢？就是angular js，代碼江湖里人稱ng，$http是ng對ajax封裝好的一個服務，用這一項服務可以省下很多用原生js進行ajax請求的代碼。

之前我們要自己構造一個請求方法、自行判斷請求的狀態(tài)是否200、自行open()和send()，加入請求的地址……

在ng里，只要一個在$http服務里調用一個get()/post()方法，寫入請求的地址，寫好success()和error()的方法，這就完成了一個ajax的請求。

下面是一則示例代碼

$scope.doRefresh = function() {

        $http.get("localhost:8080/dkplus",{
            params:{
                'tag' : 0,
                'id' : 1
            }
        })
        .success(function(data, status, header, config) {
            $scope.items = data.data;
        })
        .error(function(data, status, header, config){
            console.log('json解析錯誤');
        })

};

這是我比較熟悉的一種寫法，他還有另一種形式，功能一樣，我就不多做展示了。

第一句get()里面填入請求的地址，如果請求的同時要帶上參數，那就帶上params，如果不需要帶參數，那就只寫$http.get("localhost:8080/dkplus")就夠了。

第二句success()是用于請求成功的情況下的，是否成功可以在請求的時候按下f12，查看network一項，看狀態(tài)是否200或者response里有沒有返回json數據。

一般情況下是可以的，如果說存在跨域請求問題，這時候要用到jsonp()的方法進行請求，我們以后會討論這個問題。

function()里面的data就是++請求回來的數據++，$scope.items = data.data;里第一個data是++接收回來的數據++，第二個data其實是我請求的json里的++一個對象名++。

第三句error()就是用于錯誤情況的調用，在控制臺中顯示錯誤方法被調用了，方便調試程序。

經過兩天不眠不休，我自認為自己已經修煉神功，激動不已，于是飛鴿傳書給樟哥：

樟哥：
  小弟苦心修煉ng神功，而今掌握$http大法，數據大挪移，之日可待！

于是，我們第二天就進行了數據對接，結果就gg了，“在我電腦上本地測試是可以的啊～%>_<%～”。

至于是什么問題讓這次ng的get()方法數據對接無疾而終呢？預知后事如何，請聽下回分解。

dkplus公眾號.jpg

微信公眾號dkplus，由前端少俠dk搭建的分享平臺，主攻web前端，但也游離于設計，樂于分享他的代碼故事、ps技巧和ppt技巧。碼在江湖，身不由己，珍愛生命，簡約設計，我是前端，也是設計。博客園：http://www.cnblogs.com/dkplus/