Question

我有一个案例需要重复各种ajax源的结果。我无法在渲染之前等待所有源加载，我必须在它们进入时渲染结果。但我希望结果按特定顺序排列（按字母顺序排列）。如果所有结果同时存在，则ngRepeat会相应地对它们进行排序，但如果它们是异步加载的话，则不会对它们进行排序。

如何在加载所有结果后重新排序重复？

我创建了一个plunkr here来模拟异步ajax和我得到的无序结果。

以下是我所做的过于简化，有点人为的样本（仅供参考，因为SO需要代码）。

// ngRepeat over $scope.prices in correct order
// all ajax loaded then $scope.prices assigned
var priority = ['1 Day', '3 Day', 'Ground'];
var prices = {};
for(var i = 0; i < priority.length; ++i) {
    $http.get('some/endpoint/' + priority[i])
    .then(function(response) {
        prices[priority[i]] = response.data;
    });
}
$scope.prices = {
    '1 Day': prices['1 Day'],
    '3 Day': prices['3 Day'],
    'Ground': prices['Ground']
};

// ngRepeat over $scope.prices in order of successful load
// $scope.prices keys assigned as results are available
var priority = ['1 Day', '3 Day', 'Ground'];
for(var i = 0; i < priority.length; ++i) {
    $http.get('some/endpoint/' + priority[i])
    .then(function(response) {
        $scope.prices[priority[i]] = response.data;
    });
}

Answer 1

在main.html中，您可以使用angular

提供的orderBy函数

    <ul>
  <li ng-repeat="(priority, rates) in prices">
    <h2>{{priority}}</h2>
    <ul>
      <li ng-repeat="prices in rates | orderBy:'price'">{{prices.price}}</li>
    </ul>
  </li>
</ul>

这将采用数组进入并对输出进行排序

Answer 2

您可以使用订单并为每个价格对象（1天，2天，地面）等应用值吗？

就渲染而言，更新列表时是否可以点击ng-repeat刷新，并可能应用淡入/淡出？

重新排序angularjs ng重复后续数据结果

2 个答案: