將無限滾動調用的結果附加到AngularJS中默認顯示的結果

Question

我有函數進行$ http調用並顯示一些結果。在這個特定的函數之後，我添加了另一個函數，它將進一步調用滾動事件（使用ng-Infinite-Scroll模塊）。

我的問題是，我似乎無法將第二次和以後的調用結果追加到默認調用顯示的結果中。

這是我的代碼。

$scope.getDetails = function (id) { 
    $http.get('http://api.discogs.com/artists/' + id). 
    success(function(data) { 
     $scope.artist = data; 
    }); 
    $http.get('http://api.discogs.com/artists/' + id + '/releases?page=1&per_page=12'). 
    success(function(data2) { 
     $scope.releases = data2.releases; 
    }); 

    $scope.$watch(function() { 
    return $scope.artist; 
    }, function() { 
    var pos = $scope.artist.name.toLowerCase().indexOf(', the'); 
    if (pos != -1) { 
     $scope.artist.name = 'The ' + $scope.artist.name.slice(0, pos); 
    } 
    }); 

    var _page = 1; 
    $scope.releases = []; 
    $scope.loadDetails = function() { 
     _page++; 
     console.log(_page); 
     $http.get('http://api.discogs.com/artists/' + id + '/releases?page=' + _page + '&per_page=12').then(function(data2) { 
      $scope.releases = data2.releases; 
     }); 
    };  

    $scope.clicked = true; 
    $scope.sliding = true; 
} 

如果下面的函數將調用的第一頁和12項：

$http.get('http://api.discogs.com/artists/' + id + '/releases?page=1&per_page=12'). 
    success(function(data2) { 
     $scope.releases = data2.releases; 
}); 

後來，我觸發loadDetails功能，它會正確（第2頁，3打的電話，和等等），並更新$ scope.releases，但到目前爲止，當發生這種情況時，不是顯示新的結果，而是一旦loadDetails函數被調用完全消失。

var _page = 1; 
    $scope.releases = []; 
    $scope.loadDetails = function() { 
     _page++; 
     console.log(_page); 
     $http.get('http://api.discogs.com/artists/' + id + '/releases?page=' + _page + '&per_page=12').then(function(data2) { 
      $scope.releases = data2.releases; 
     }); 
    }; 

我假設的，而不是重新定義$ scope.releases，我必須從第二次及以後調用的結果追加到它，但我看不出我會做到這一點。

任何提示？

這是working Plunker。

Answer 1

我認爲主要問題是id從loadDetails簽名中丟失，而.then未等待$http.get返回發佈。我用.success代替，它工作。

這是你plunker的更新：http://plnkr.co/edit/gSwRNUn9mBvhWDtIaEzD

$scope.getDetails = function(id) { 
    $scope._page = 1; 
    $scope.releases = []; 

    $http.get('http://api.discogs.com/artists/' + id). 
    success(function(data) { 
    $scope.artist = data; 
    }); 
    $http.get('http://api.discogs.com/artists/' + id + '/releases?page=1&per_page=12'). 
    success(function(data2) { 
    $scope.releases = data2.releases; 
    }); 


    $scope.clicked = true; 
    $scope.sliding = true; 
}; 

$scope.loadDetails = function(id) { 
    console.log(id); 
    if (!angular.isUndefined(id)) { 
    $scope._page++; 
    console.log($scope._page); 
    $http.get('http://api.discogs.com/artists/' + id + '/releases?page=' + $scope._page + '&per_page=12'). 
    success(function(data2) { 
     for (var i = 0; i < data2.releases.length; i++) { 
     $scope.releases.push(data2.releases[i]); 
     } 
    }); 
    } 
}; 

我只是用一個循環，並.push要追加到數組。