2016-09-24 66 views
0

我正在爲學校做項目,我們必須連接到API並獲取一些數據。我的同學和我正試圖通過他們的API連接到Imgur,並在前100頁上收回有關圖像的信息,基本上是趨勢分析。從我所知道的來看,Imgur的API只允許你一次訪問一頁的信息,所以我已經把http變成了一個for循環,它會經歷前100頁。爲了分析這些數據,我們需要將它放入一個數組中,然後我們可以從中抽取數據。我們有這樣的事情至今:如何從多個獲取請求角度創建Json對象數組

app.service("dataGrab", function($http){ 
    this.getPages = function() { 
    var pageData = new Array(); 

     for(var i=0; i < 3; i++) { 
    var imgurl = "https://api.imgur.com/3/gallery/hot/viral/" + i + ".json"; 
    $http({ 
     headers: {'Authorization': 'Client-ID 55f28598b46e0fa'}, 
     method: 'GET', 
     url: imgurl 
    }).then(function successCallback(response) { 
     $.each(response, function(i){ 
     pageData.push(response[i]); 
     }) 
     alert(pageData.length); 
    }, function errorCallback(response) { 
     console.log("Failed to call get on " + imgurl); 

    }); 
    }; 
    return pageData; 

    } 
}); 

app.controller("imgurCtrl", function($scope, $http, dataGrab) { 
    $scope.test = "This is a test"; 
    $scope.imgurData = dataGrab.getPages(); 
    console.log($scope.imgurData); 




}); 

什麼了我最想要的是每個JSON對象返回到陣列中,而是我們得到這個我不完全理解:

[Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object]0: Object1: Object2: Object$$hashKey: "object:5"account_id: ********* 
account_url: "******"animated: truebandwidth: ******comment_count: 167datetime: 
*********description: nulldowns: 108favorite: falsegifv: "******"height: 1284id: 
"*************"in_gallery: trueis_ad: falseis_album: falselink: 
"***********"looping: truemp4: "**********"mp4_size: 870041nsfw: falsepoints: 
5594score: 5784section: "gifs"size: 8022766title: "*********"topic: 
"******"topic_id: 5type: "image/gif"ups: 5702views: 382017vote: nullwidth: 720__proto__: Object3: Object4: Object5: Object6: Object7: Object8: Object9: 
Object10: Object11: Object12: Object13: Object14: Object15: Object16: Object17: 
Object18: Object19: Object20: Object21: Object22: Object23: Object24: Object25: 
Object26: Object27: Object28: Object29: Object30: Object31: Object32: Object33: 
Object34: Object35: Object36: Object37: Object38: Object39: Object40: Object41: 
Object42: Object43: Object44: Object45: Object46: Object47: Object48: Object49: 
Object50: Object51: Object52: Object53: Object54: Object55: Object56: Object57: 
Object58: Object59: Objectlength: 60__proto__: Array[0] 
    ctrl.js:37 [Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object…][0 … 99][100 … 199][200 … 299][300 … 399][400 … 499][500 … 599] 
[600 … 642]length: 643__proto__: Array[0] 
    ctrl.js:37 [Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, 
Object, Object…][0 … 99][100 … 199][200 … 299][300 … 399][400 … 499][500 … 599] 
[600 … 680]length: 681__proto__: Array[0] 

回答

1

首先,根據Angular http docs,您需要從response.data而不是response得到結果。

其次,http請求是異步的。所以你需要從你的getPages方法中返回一個承諾。在這種情況下,你可以創建一個對HTTP請求的所有承諾等待一個承諾:

app.service("dataGrab", function($http) { 
    this.fetchImgur = function(url) { 
    return $http({ 
     url: url, 
     method: 'GET', 
     headers: {'Authorization': 'Client-ID 55f28598b46e0fa'} 
    }).then(function successCallback(response) { 
     return response.data; 
    }, function errorCallback(response) { 
     console.log("Request failed for URL:", url); 
    }); 
    }; 

    this.getPages = function(count) { 
    var requests = new Array(count); 
    for (var i = 0; i < count; i++) { 
     requests[i] = this.fetchImgur("https://api.imgur.com/3/gallery/hot/viral/" + i + ".json"); 
    } 
    // This creates a promise that resolves once all requests are resolved. 
    return Promise.all(requests).then(function(pages) { 
     // Some JS magic to concatenate all pages into a single array. 
     return Array.prototype.concat.apply([], pages); 
    }); 
    } 
}); 

app.controller("imgurCtrl", function($scope, dataGrab) { 
    $scope.test = "This is a test"; 
    dataGrab.getPages(3).then(function(imgurData) { 
    $scope.imgurData = imgurData; 
    console.log(imgurData); 
    }); 
}); 

希望幫助!