当来自多个http调用的数据异步时，如何对列表进行排序

Question

I need to loop a list of URLs and display the results in one table. It seems like orderBy does not work because list($scope.versions) is from multiple HTTP calls and HTTP is asynchronous.

Controller:

var callApi = function (app, env, index, url) {
  $http.get(url).
     success(function(data) {
       data.pos=index;
       $scope.versions[app].push([data]);
     }).
     error(function(data, status) {
       var errorData = {};
       errorData.pos=index;
       $scope.versions[app].push([errorData]);
     });
   console.log($scope.versions);
 };

HTML:

<tbody>
  <tr ng-repeat="(k,v) in versions">
    <td>{{k}}</td>
    <td ng-repeat="item in v |  orderBy:'item[0].pos'" 
      ng-class="{'danger': item[0].error === true, 'success': item[0].error === false}">
      [{{item[0].pos}}]
    </td>
  </tr>
</tbody>

Answer 1

It's a little unclear what exactly you're trying to do and it's unclear what your data looks like, but in a general sense, you can always sort your data as it comes in.

For example, you could use splice() to insert the data where it needs to be in the array:

$scope.items = [];
var urls = [ <some urls> ];
urls.forEach( function (url) {
  $http.get(url)
    .success( function (data) {
      var position = getPosition(data);
      $scope.items.splice(position, 0, data);
    })
    .error( function (data, status) {
      // Handle the error case
    });
});

function getPosition (data) {
  // Some code to find where the element
  // should be inserted into the array
  return position;
}

Or, you could sort the data every time after your add new data:

$scope.items = [];
var urls = [ <some urls> ];
urls.forEach( function (url) {
  $http.get(url)
    .success( function (data) {
      $scope.items.push(data);
      $scope.items.sort(itemsCompareFunc)
    })
    .error( function (data, status) {
      // Handle the error case
    });
});

function itemsCompareFunc (a, b) {
  // Some logic to compare both items
}