Question

使用angular.filter我使用groupBy和length来计算用户emailId记录的记录数

           <div ng-repeat="(key, value) in leaderboard | groupBy: 'emailId'">
                 <h3>{{ key }} {{ filteredList.length}}</h3>
                 <li ng-repeat="leaderboard in value | filter: emailId as filteredList"></li>
           </div>

这一切都很好，给我一个emailIds列表，每个emailId的记录数量以及下面列出的记录。

我尝试做的是按每个emailId的记录数量排序数据（换句话说，按{{filteredList.length}}返回的值对数据进行排序。）

我尝试将orderBy添加到ng-repeat中，如下所示

      <div ng-repeat="(key, value) in leaderboard | groupBy: 'emailId' | orderBy: filtered.length">
             <h3>{{ key }} {{ filteredList.length}}</h3>
             <li ng-repeat="leaderboard in value | filter: emailId as filteredList"></li>
       </div>

但这对列出项目的顺序没有任何影响。我已经查看了现有的答案，但是所有的orderBy都没有使用groupBy似乎是指按值中包含的项而不是过滤器的长度进行排序。

Answer 1

角度过滤器的用户组已经在下面的链接中写了需要做的事情： https://github.com/a8m/angular-filter/issues/57#issuecomment-65041792

groupBy返回一个对象，但orderBy fiter需要一个数组。所以使用toArray：true并给orderBy一个数组来处理。

以下是必须运作的代码：

   <div ng-repeat="(key, value) in leaderboard | groupBy: 'emailId' | toArray: true |orderBy: filtered.length">
         <h3>{{ key }} {{ filteredList.length}}</h3>
         <li ng-repeat="leaderboard in value | filter: emailId as filteredList"></li>
   </div>

另外，请记住orderBy必须是链接中的最后一个过滤器。

修改

您还可以切换orderBy和groupBy的位置。如果OrderBy过滤器在第一个位置进行排序，那么groupBy过滤器初始化后不使用toArray过滤器

示例：

<div ng-repeat="(key, value) in array | orderBy: filtered.length | groupBy: 'emailId'">
             <h3>{{ key }} {{ filteredList.length}}</h3>
             <li ng-repeat="leaderboard in value | filter: emailId as filteredList"></li>
       </div>

Answer 2

这可以通过先排序再分组来轻松解决。更好的表现。

<div ng-repeat="(key, value) in leaderboard | orderBy: filtered.length" | groupBy: 'emailId'>
    <h3>{{ key }} {{ filteredList.length}}</h3>
    <li ng-repeat="leaderboard in value | filter: emailId as filteredList"></li>
 </div>

AngularJS groupBy orderBy

2 个答案: