角度 orderBy 和范围

Question

我想知道当数据分布在多个表中时如何正确排序表数据。我有一些应用程序数据根据应用程序所属的国家/地区显示在表格中，即每个国家/地区都有自己的应用程序数据表。我可以通过单击表格标题（应用程序属性）使用 orderBy 对表格数据进行排序，但单击其中一个国家/地区表格的标题会对所有国家/地区表格进行排序。我想知道如何隔离范围，以便单击一个国家/地区的应用程序数据表的表标题只会更改其应用程序数据的顺序，而不会更改其他国家/地区的应用程序数据表。我尝试将 countryId 属性添加到应用程序数据中，然后根据当前单击的国家/地区表进行过滤，但这只会导致其他国家/地区表为空。隔离 orderBy 范围的正确方法是什么？

<div class="table-responsive" ng-repeat="countryReleases in regionRelease.countryReleases">
    <h5><strong>{{ countryReleases.countryName }}</strong></h5>
    <table id="app" class="table table-striped table-bordered table-condensed">
        <thead>
            <tr>                    
                <th ng-click="vm.sortCountry = countryReleases.countryId; vm.sortName = 'application.name'; vm.sortReverse = !vm.sortReverse">
                    <span>App Name</span>
                    <span ng-show="vm.sortName == 'application.name' && !vm.sortReverse" class="pull-right fa fa-caret-up"></span>
                    <span ng-show="vm.sortName == 'application.name' && vm.sortReverse" class="pull-right fa fa-caret-down"></span>
                </th>
                <th>App Prop 2</th>
                ...
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="appReleases in countryReleases.appReleases | filter:vm.sortCountry | orderBy:vm.sortName:vm.sortReverse">
                <td>
                    <img class="thumbnail" ng-src="{{ appReleases.application.icon }}">
                    ... 

// 编辑： 通过将当前迭代的范围传递给控制器​​中的 orderBy 过滤器来修复：

<th ng-click="vm.sortName = 'application.name'; vm.sortReverse = !vm.sortReverse; vm.orderByAppCountry(this, vm.sortName, vm.sortReverse)">
...

<tr ng-repeat="appReleases in countryReleases.appReleases">
...

  function orderByAppCountry(scope, predicate, reverse) {
    scope.countryReleases.appReleases = $filter('orderBy')(scope.countryReleases.appReleases, predicate, reverse);
  }

Answer 1

通过将 orderBy 过滤器添加到控制器并从国家/地区表的单击中调用来修复，请参见上面的编辑。