Javascript AngularJS表示排序已完成

我有一个非常大的数据集需要排序。我已经完成了排序，唯一的问题是当按下排序按钮时，在排序完成之前不会发生任何事情。在较小的数据集上，这不是问题，因为它几乎是瞬时的

我有一个函数来更改排序参数，但我不确定是什么，如果从angular发出任何信号来表示排序/渲染已完成。此信号将用于隐藏/销毁微调器

指令模板：

<div data-ng-if="dataModel">
    <div class="drillHeader" style="width:{{(dataModel.depth * 20) + 200}}px;">Groupings</div>
    <!-- dynamic sort buttons -->
    <div class="drillHeader drillSorter"
         data-ng-repeat="c in dataModel.columns"
         data-ng-class="{drillBorderLeft : $first, asc: asc == true && sortBy == 'totals.'+c, desc: asc == false && sortBy == 'totals.'+c}"
         data-ng-click="changeSort(c)">{{makePrettyKeyNames(c)}}</div>
</div>
<div data-ng-repeat="d in dataModel.data | orderObjectByDeep:sortBy:asc" data-ng-class="{even: $even, odd: $odd}">
    <div class="drillSection collapsed" data-ng-class="{noCollapse: dataModel.depth == 1}">
        <div class="drillItem" style="width:{{(dataModel.depth * 20) + 200}}px;">
            <span class="drillHead">{{makePrettyKeyNames(d.keyName)}}:</span> {{d.key}}
        </div>
        <div class="drillData" data-ng-repeat="key in dataModel.columns" data-ng-class="{drillBorderLeft : $first}">{{formatData(d.totals[key], key)}}</div>
    </div>
    <div class="drillCollapse" style="display:none;" data-ng-if="dataModel.depth != 2" data-ng-include="'level2template'" onload="data=d.metrics"></div>
    <div class="drillCollapse" style="display:none;" data-ng-if="dataModel.depth == 2" data-ng-include="'finalLevelTemplate'" onload="data=d.metrics"></div>
</div>

我正在使用一个自定义的排序过滤器，但我想不出一种方法让它发送信号

angular.module('myApp').filter('orderObjectByDeep', function() {
    return function(items, field, reverse) {
        var properties = field.split(".");

        var filtered = [];
        angular.forEach(items, function(item) {
            filtered.push(item);
        });
        filtered.sort(function(a, b) {
            var x = a;
            var y = b;
            for (var i in properties) {
                x = x[properties[i]];
                y = y[properties[i]];
            }
            return (x > y ? 1 : -1);
        });
        if (reverse)
            filtered.reverse();
        return filtered;
    };
});

---

我决不是一个有棱角的专家，但我通常能找到答案，但这一点让我感到困惑。谢谢您的帮助。

在这种情况下，我宁愿在控制器内部对列表进行排序，而不是在视图中对列表进行排序。您可以使用

$timeout

服务对数据进行异步排序

所以在你看来，你有这样的想法：

<ul>
  <li ng-repeat="item in sortedList">{{item}}</li>
</ul>
<div ng-if="!isSorted">Loader</div>

---

不需要擦拭分拣列表。删除它的好处是我的折叠（树型数据）保持打开状态。我将控制器部分放置在changeSort函数中，并附加了一个超时，以帮助微调器更早地显示出来。

<ul>
  <li ng-repeat="item in sortedList">{{item}}</li>
</ul>
<div ng-if="!isSorted">Loader</div>

isSorted = false;
$scope.sortedList = [];
$timeout(function () {
  $scope.sortedList = $filter('orderObjectByDeep')(dataModel.data, sortBy, asc);
  isSorted = true;
});