blocks|key|196269|text|首先使用一个仅返回唯一球队的过滤器执行一个循环，然后执行一个嵌套循环，该循环返回每个当前球队的所有球员：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|196270|http://jsfiddle.net/plantface/L6cQN/|offset|length|196271|html：|196272|<div+ng-app+ng-controller="Main">
++++<div+ng-repeat="playerPerTeam+in+playersToFilter()+%7C+filter:filterTeams">
++++++++{{playerPerTeam.team}}
++++++++<li+ng-repeat="player+in+players+%7C+filter:{team:+playerPerTeam.team}">{{player.name}}</li>++++++++
++++</div>
</div>|code-block|syntax|javascript|196273|脚本：|196274|function+Main($scope)+{
++++$scope.players+=+[{name:+'Gene',+team:+'team+alpha'},
++++++++++++++++++++{name:+'George',+team:+'team+beta'},
++++++++++++++++++++{name:+'Steve',+team:+'team+gamma'},
++++++++++++++++++++{name:+'Paula',+team:+'team+beta'},
++++++++++++++++++++{name:+'Scruath+of+the+5th+sector',+team:+'team+gamma'}];

++++var+indexedTeams+=+[];

++++//+this+will+reset+the+list+of+indexed+teams+each+time+the+list+is+rendered+again
++++$scope.playersToFilter+=+function()+{
++++++++indexedTeams+=+[];
++++++++return+$scope.players;
++++}

++++$scope.filterTeams+=+function(player)+{
++++++++var+teamIsNew+=+indexedTeams.indexOf(player.team)+==+-1;
++++++++if+(teamIsNew)+{
++++++++++++indexedTeams.push(player.team);
++++++++}
++++++++return+teamIsNew;
++++}
}|196275|entityMap|0|LINK|mutability|MUTABLE|url^0|0|0|10|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|X|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|Y|8|@]|9|@$D|Z|E|10|1|11]]|A|$]]|$1|F|3|G|5|6|7|12|8|@]|9|@]|A|$]]|$1|H|3|I|5|J|7|13|8|@]|9|@]|A|$K|L]]|$1|M|3|N|5|6|7|14|8|@]|9|@]|A|$]]|$1|O|3|P|5|J|7|15|8|@]|9|@]|A|$K|L]]|$1|Q|3|-4|5|6|7|16|8|@]|9|@]|A|$]]]|R|$S|$5|T|U|V|A|$W|C]]]]

First do a loop using a filter that will return only unique teams, and then a nested loop that returns all players per current team:

<a href="http://jsfiddle.net/plantface/L6cQN/" rel="noreferrer">http://jsfiddle.net/plantface/L6cQN/</a>

html:

<pre><code>&lt;div ng-app ng-controller="Main"&gt;
 &lt;div ng-repeat="playerPerTeam in playersToFilter() | filter:filterTeams"&gt;
 &lt;b&gt;{{playerPerTeam.team}}&lt;/b&gt;
 &lt;li ng-repeat="player in players | filter:{team: playerPerTeam.team}"&gt;{{player.name}}&lt;/li&gt; 
 &lt;/div&gt;
&lt;/div&gt;
</code></pre>

script:

<pre><code>function Main($scope) {
 $scope.players = [{name: 'Gene', team: 'team alpha'},
 {name: 'George', team: 'team beta'},
 {name: 'Steve', team: 'team gamma'},
 {name: 'Paula', team: 'team beta'},
 {name: 'Scruath of the 5th sector', team: 'team gamma'}];

 var indexedTeams = [];

 // this will reset the list of indexed teams each time the list is rendered again
 $scope.playersToFilter = function() {
 indexedTeams = [];
 return $scope.players;
 }

 $scope.filterTeams = function(player) {
 var teamIsNew = indexedTeams.indexOf(player.team) == -1;
 if (teamIsNew) {
 indexedTeams.push(player.team);
 }
 return teamIsNew;
 }
}
</code></pre>

blocks|key|198198|text|我最初使用的是Plantface的答案，但我不喜欢语法在我看来的样子。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|198199|我对它进行了修改，使用$q.defer对数据进行后处理，并返回一个关于唯一团队的列表，然后将其用作过滤器。|offset|length|198200|http://plnkr.co/edit/waWv1donzEMdsNMlMHBa?p=preview|198201|视图|198202|<ul>
++<li+ng-repeat="team+in+teams">{{team}}
++++<ul>
++++++<li+ng-repeat="player+in+players+%7C+filter:+{team:+team}">{{player.name}}</li>+
++++</ul>
++</li>
</ul>|code-block|syntax|javascript|198203|控制器|198204|app.controller('MainCtrl',+function($scope,+$q)+{

++$scope.players+=+[];+//+omitted+from+SO+for+brevity

++//+create+a+deferred+object+to+be+resolved+later
++var+teamsDeferred+=+$q.defer();

++//+return+a+promise.+The+promise+says,+"I+promise+that+I'll+give+you+your
++//+data+as+soon+as+I+have+it+(which+is+when+I+am+resolved)".
++$scope.teams+=+teamsDeferred.promise;

++//+create+a+list+of+unique+teams.+unique()+definition+omitted+from+SO+for+brevity
++var+uniqueTeams+=+unique($scope.players,+'team');

++//+resolve+the+deferred+object+with+the+unique+teams
++//+this+will+trigger+an+update+on+the+view
++teamsDeferred.resolve(uniqueTeams);

});|198205|entityMap|0|LINK|mutability|MUTABLE|url|http://docs.angularjs.org/api/ng.$q|1^0|0|B|8|0|0|0|1F|1|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|11|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|12|8|@]|9|@$D|13|E|14|1|15]]|A|$]]|$1|F|3|G|5|6|7|16|8|@]|9|@$D|17|E|18|1|19]]|A|$]]|$1|H|3|I|5|6|7|1A|8|@]|9|@]|A|$]]|$1|J|3|K|5|L|7|1B|8|@]|9|@]|A|$M|N]]|$1|O|3|P|5|6|7|1C|8|@]|9|@]|A|$]]|$1|Q|3|R|5|L|7|1D|8|@]|9|@]|A|$M|N]]|$1|S|3|-4|5|6|7|1E|8|@]|9|@]|A|$]]]|T|$U|$5|V|W|X|A|$Y|Z]]|10|$5|V|W|X|A|$Y|G]]]]

I originally used Plantface's answer, but I didn't like how the syntax looked in my view.

I reworked it to use <a href="http://docs.angularjs.org/api/ng.$q" rel="noreferrer">$q.defer</a> to post-process the data and return a list on unique teams, which is then uses as the filter.

<a href="http://plnkr.co/edit/waWv1donzEMdsNMlMHBa?p=preview" rel="noreferrer">http://plnkr.co/edit/waWv1donzEMdsNMlMHBa?p=preview</a>

<h3>View</h3>

<pre><code>&lt;ul&gt;
 &lt;li ng-repeat="team in teams"&gt;{{team}}
 &lt;ul&gt;
 &lt;li ng-repeat="player in players | filter: {team: team}"&gt;{{player.name}}&lt;/li&gt; 
 &lt;/ul&gt;
 &lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<h3>Controller</h3>

<pre><code>app.controller('MainCtrl', function($scope, $q) {

 $scope.players = []; // omitted from SO for brevity

 // create a deferred object to be resolved later
 var teamsDeferred = $q.defer();

 // return a promise. The promise says, "I promise that I'll give you your
 // data as soon as I have it (which is when I am resolved)".
 $scope.teams = teamsDeferred.promise;

 // create a list of unique teams. unique() definition omitted from SO for brevity
 var uniqueTeams = unique($scope.players, 'team');

 // resolve the deferred object with the unique teams
 // this will trigger an update on the view
 teamsDeferred.resolve(uniqueTeams);

});
</code></pre>

blocks|key|196301|text|这两个答案都很好，所以我将它们移到一个指令中，这样它就可以重用，并且不需要定义第二个作用域变量。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|196302|如果您希望看到它的实现，请使用Here+is+the+fiddle|offset|length|196303|以下是指令：|196304|var+uniqueItems+=+function+(data,+key)+{
++++var+result+=+[];
++++for+(var+i+=+0;+i+<+data.length;+i%2B%2B)+{
++++++++var+value+=+data[i][key];
++++++++if+(result.indexOf(value)+==+-1)+{
++++++++++++result.push(value);
++++++++}
++++}
++++return+result;
};

myApp.filter('groupBy',
++++++++++++function+()+{
++++++++++++++++return+function+(collection,+key)+{
++++++++++++++++++++if+(collection+===+null)+return;
++++++++++++++++++++return+uniqueItems(collection,+key);
++++++++};
++++});|code-block|syntax|javascript|196305|然后可以按如下方式使用它：|196306|<div+ng-repeat="team+in+players%7CgroupBy:'team'">
++++{{team}}
++++<li+ng-repeat="player+in+players+%7C+filter:+{team:+team}">{{player.name}}</li>++++++++
</div>|196307|entityMap|0|LINK|mutability|MUTABLE|url|http://jsfiddle.net/S3vaj/1/^0|0|F|I|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Y|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|Z|8|@]|9|@$D|10|E|11|1|12]]|A|$]]|$1|F|3|G|5|6|7|13|8|@]|9|@]|A|$]]|$1|H|3|I|5|J|7|14|8|@]|9|@]|A|$K|L]]|$1|M|3|N|5|6|7|15|8|@]|9|@]|A|$]]|$1|O|3|P|5|J|7|16|8|@]|9|@]|A|$K|L]]|$1|Q|3|-4|5|6|7|17|8|@]|9|@]|A|$]]]|R|$S|$5|T|U|V|A|$W|X]]]]

Both answers were good so I moved them in to a directive so that it is reusable and a second scope variable doesn't have to be defined.

<a href="http://jsfiddle.net/S3vaj/1/">Here is the fiddle</a> if you want to see it implemented

Below is the directive:

<pre><code>var uniqueItems = function (data, key) {
 var result = [];
 for (var i = 0; i &lt; data.length; i++) {
 var value = data[i][key];
 if (result.indexOf(value) == -1) {
 result.push(value);
 }
 }
 return result;
};

myApp.filter('groupBy',
 function () {
 return function (collection, key) {
 if (collection === null) return;
 return uniqueItems(collection, key);
 };
 });
</code></pre>

Then it can be used as follows:

<pre><code>&lt;div ng-repeat="team in players|groupBy:'team'"&gt;
 &lt;b&gt;{{team}}&lt;/b&gt;
 &lt;li ng-repeat="player in players | filter: {team: team}"&gt;{{player.name}}&lt;/li&gt; 
&lt;/div&gt;
</code></pre>

blocks|key|2827272|text|除了上面接受的答案之外，我还使用underscore.js库创建了一个通用的“groupBy”过滤器。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2827273|JSFiddle+(更新)：http://jsfiddle.net/TD7t3/|offset|length|2827274|The+filter|style|BOLD|2827275|app.filter('groupBy',+function()+{
++++return+_.memoize(function(items,+field)+{
++++++++++++return+_.groupBy(items,+field);
++++++++}
++++);
});|code-block|syntax|javascript|2827276|注意“memoize”调用。此下划线方法缓存函数的结果，并停止angular每次计算过滤器表达式，从而防止angular达到摘要迭代限制。|2827277|The+html|2827278|<ul>
++++<li+ng-repeat="(team,+players)+in+teamPlayers+%7C+groupBy:'team'">
++++++++{{team}}
++++++++<ul>
++++++++++++<li+ng-repeat="player+in+players">
++++++++++++++++{{player.name}}
++++++++++++</li>
++++++++</ul>
++++</li>
</ul>|2827279|我们在teamPlayers作用域变量的'team‘属性上应用了'groupBy’过滤器。我们的ng-repeat接收(key，values[])的组合，我们可以在后面的迭代中使用它。|2827280|更新2014年6月11日I扩展了group+by筛选器，以考虑使用表达式作为键(例如嵌套变量)。在这方面，angular解析服务非常方便：|2827281|过滤器(支持表达式)|2827282|app.filter('groupBy',+function($parse)+{
++++return+_.memoize(function(items,+field)+{
++++++++var+getter+=+$parse(field);
++++++++return+_.groupBy(items,+function(item)+{
++++++++++++return+getter(item);
++++++++});
++++});
});|2827283|控制器(带有嵌套对象)|2827284|app.controller('homeCtrl',+function($scope)+{
++++var+teamAlpha+=+{name:+'team+alpha'};
++++var+teamBeta+=+{name:+'team+beta'};
++++var+teamGamma+=+{name:+'team+gamma'};

++++$scope.teamPlayers+=+[{name:+'Gene',+team:+teamAlpha},
++++++++++++++++++++++{name:+'George',+team:+teamBeta},
++++++++++++++++++++++{name:+'Steve',+team:+teamGamma},
++++++++++++++++++++++{name:+'Paula',+team:+teamBeta},
++++++++++++++++++++++{name:+'Scruath+of+the+5th+sector',+team:+teamGamma}];
});|2827285|+html+(使用sortBy表达式)|2827286|<li+ng-repeat="(team,+players)+in+teamPlayers+%7C+groupBy:'team.name'">
++++{{team}}
++++<ul>
++++++++<li+ng-repeat="player+in+players">
++++++++++++{{player.name}}
++++++++</li>
++++</ul>
</li>|2827287|JSFiddle：http://jsfiddle.net/k7fgB/2/|2827288|entityMap|0|LINK|mutability|MUTABLE|url|http://jsfiddle.net/TD7t3/|1|http://jsfiddle.net/k7fgB/2/^0|0|E|Q|0|0|0|A|0|0|0|0|8|0|0|0|0|C|0|0|A|0|0|0|B|0|0|0|J|0|0|9|S|1|0^^$0|@$1|2|3|4|5|6|7|1M|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|1N|8|@]|9|@$D|1O|E|1P|1|1Q]]|A|$]]|$1|F|3|G|5|6|7|1R|8|@$D|1S|E|1T|H|I]]|9|@]|A|$]]|$1|J|3|K|5|L|7|1U|8|@]|9|@]|A|$M|N]]|$1|O|3|P|5|6|7|1V|8|@]|9|@]|A|$]]|$1|Q|3|R|5|6|7|1W|8|@$D|1X|E|1Y|H|I]]|9|@]|A|$]]|$1|S|3|T|5|L|7|1Z|8|@]|9|@]|A|$M|N]]|$1|U|3|V|5|6|7|20|8|@]|9|@]|A|$]]|$1|W|3|X|5|6|7|21|8|@$D|22|E|23|H|I]]|9|@]|A|$]]|$1|Y|3|Z|5|6|7|24|8|@$D|25|E|26|H|I]]|9|@]|A|$]]|$1|10|3|11|5|L|7|27|8|@]|9|@]|A|$M|N]]|$1|12|3|13|5|6|7|28|8|@$D|29|E|2A|H|I]]|9|@]|A|$]]|$1|14|3|15|5|L|7|2B|8|@]|9|@]|A|$M|N]]|$1|16|3|17|5|6|7|2C|8|@$D|2D|E|2E|H|I]]|9|@]|A|$]]|$1|18|3|19|5|L|7|2F|8|@]|9|@]|A|$M|N]]|$1|1A|3|1B|5|6|7|2G|8|@]|9|@$D|2H|E|2I|1|2J]]|A|$]]|$1|1C|3|-4|5|6|7|2K|8|@]|9|@]|A|$]]]|1D|$1E|$5|1F|1G|1H|A|$1I|1J]]|1K|$5|1F|1G|1H|A|$1I|1L]]]]

In addition to the accepted answers above I created a generic 'groupBy' filter using the underscore.js library.

JSFiddle (updated):
<a href="http://jsfiddle.net/TD7t3/">http://jsfiddle.net/TD7t3/</a>

The filter

<pre><code>app.filter('groupBy', function() {
 return _.memoize(function(items, field) {
 return _.groupBy(items, field);
 }
 );
});
</code></pre>

Note the 'memoize' call. This underscore method caches the result of the function and stops angular from evaluating the filter expression every time, thus preventing angular from reaching the digest iterations limit.

The html

<pre><code>&lt;ul&gt;
 &lt;li ng-repeat="(team, players) in teamPlayers | groupBy:'team'"&gt;
 {{team}}
 &lt;ul&gt;
 &lt;li ng-repeat="player in players"&gt;
 {{player.name}}
 &lt;/li&gt;
 &lt;/ul&gt;
 &lt;/li&gt;
&lt;/ul&gt;
</code></pre>

We apply our 'groupBy' filter on the teamPlayers scope variable, on the 'team' property. Our ng-repeat receives a combination of (key, values[]) that we can use in our following iterations.

Update June 11th 2014
I expanded the group by filter to account for the use of expressions as the key (eg nested variables). The angular parse service comes in quite handy for this:

The filter (with expression support)

<pre><code>app.filter('groupBy', function($parse) {
 return _.memoize(function(items, field) {
 var getter = $parse(field);
 return _.groupBy(items, function(item) {
 return getter(item);
 });
 });
});
</code></pre>

The controller (with nested objects)

<pre><code>app.controller('homeCtrl', function($scope) {
 var teamAlpha = {name: 'team alpha'};
 var teamBeta = {name: 'team beta'};
 var teamGamma = {name: 'team gamma'};

 $scope.teamPlayers = [{name: 'Gene', team: teamAlpha},
 {name: 'George', team: teamBeta},
 {name: 'Steve', team: teamGamma},
 {name: 'Paula', team: teamBeta},
 {name: 'Scruath of the 5th sector', team: teamGamma}];
});
</code></pre>

The html (with sortBy expression)

<pre><code>&lt;li ng-repeat="(team, players) in teamPlayers | groupBy:'team.name'"&gt;
 {{team}}
 &lt;ul&gt;
 &lt;li ng-repeat="player in players"&gt;
 {{player.name}}
 &lt;/li&gt;
 &lt;/ul&gt;
&lt;/li&gt;
</code></pre>

JSFiddle:
<a href="http://jsfiddle.net/k7fgB/2/">http://jsfiddle.net/k7fgB/2/</a>

blocks|key|198272|text|您可以使用angular.filter模块的groupBy。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|198273|所以你可以这样做：|198274|JS:|style|BOLD|198275|$scope.players+=+[
++{name:+'Gene',+team:+'alpha'},
++{name:+'George',+team:+'beta'},
++{name:+'Steve',+team:+'gamma'},
++{name:+'Paula',+team:+'beta'},
++{name:+'Scruath',+team:+'gamma'}
];|code-block|syntax|javascript|198276|HTML：|198277|<ul+ng-repeat="(key,+value)+in+players+%7C+groupBy:+'team'">
++Group+name:+{{+key+}}
++<li+ng-repeat="player+in+value">
++++player:+{{+player.name+}}+
++</li>
</ul>|198278|结果：|198279|组名称:+alpha|198280|+\*+player:+Gene|198281|组名:+beta|198282|+\*+player:+George|198283|+\*+player:+Paula|198284|组名:+gamma|198285|+\*+player:+Steve|198286|+\*+player:+Scruath|198287|更新：+jsbin记住使用angular.filter的基本要求，特别注意您必须将其添加到模块的依赖项中：|CODE|198288|198289|+(1)您可以使用4种不同的方法安装angular-filter：|blockquote|198290|198291|198292|通过运行$|198293|从终端|unordered-list-item|198294|
|198295|通过npm安装repository|198296|198297|via+-filter:通过cdnjs+http://www.cdnjs.com/libraries/angular-filter|198298|
从终端|198299|安装angular-filter|198300|198301|(2)在包含Angular本身之后，在您的index.html中包含angular-filter.js+(或angular-filter.min.js)。|198302|(3)将'angular.filter‘添加到主模块的依赖项列表中。|198303|entityMap|0|LINK|mutability|MUTABLE|url|https://github.com/a8m/angular-filter|1|http://jsbin.com/weyov/45/edit?html,js,output|2|http://www.cdnjs.com/libraries/angular-filter^0|5|E|0|0|0|0|3|0|0|0|0|0|3|0|0|0|0|0|0|0|0|0|0|3|D|E|4|5|1|0|0|0|0|0|0|0|0|0|0|K|19|2|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|2G|8|@]|9|@$A|2H|B|2I|1|2J]]|C|$]]|$1|D|3|E|5|6|7|2K|8|@]|9|@]|C|$]]|$1|F|3|G|5|6|7|2L|8|@$A|2M|B|2N|H|I]]|9|@]|C|$]]|$1|J|3|K|5|L|7|2O|8|@]|9|@]|C|$M|N]]|$1|O|3|P|5|6|7|2P|8|@]|9|@]|C|$]]|$1|Q|3|R|5|L|7|2Q|8|@]|9|@]|C|$M|N]]|$1|S|3|T|5|6|7|2R|8|@$A|2S|B|2T|H|I]]|9|@]|C|$]]|$1|U|3|V|5|6|7|2U|8|@]|9|@]|C|$]]|$1|W|3|X|5|L|7|2V|8|@]|9|@]|C|$M|N]]|$1|Y|3|Z|5|6|7|2W|8|@]|9|@]|C|$]]|$1|10|3|11|5|L|7|2X|8|@]|9|@]|C|$M|N]]|$1|12|3|13|5|L|7|2Y|8|@]|9|@]|C|$M|N]]|$1|14|3|15|5|6|7|2Z|8|@]|9|@]|C|$]]|$1|16|3|17|5|L|7|30|8|@]|9|@]|C|$M|N]]|$1|18|3|19|5|L|7|31|8|@]|9|@]|C|$M|N]]|$1|1A|3|1B|5|6|7|32|8|@$A|33|B|34|H|I]|$A|35|B|36|H|1C]]|9|@$A|37|B|38|1|39]]|C|$]]|$1|1D|3|-4|5|6|7|3A|8|@]|9|@]|C|$]]|$1|1E|3|1F|5|1G|7|3B|8|@]|9|@]|C|$]]|$1|1H|3|-4|5|6|7|3C|8|@]|9|@]|C|$]]|$1|1I|3|-4|5|6|7|3D|8|@]|9|@]|C|$]]|$1|1J|3|1K|5|6|7|3E|8|@]|9|@]|C|$]]|$1|1L|3|1M|5|1N|7|3F|8|@]|9|@]|C|$]]|$1|1O|3|1P|5|6|7|3G|8|@]|9|@]|C|$]]|$1|1Q|3|1R|5|1N|7|3H|8|@]|9|@]|C|$]]|$1|1S|3|1P|5|6|7|3I|8|@]|9|@]|C|$]]|$1|1T|3|1U|5|1N|7|3J|8|@]|9|@$A|3K|B|3L|1|3M]]|C|$]]|$1|1V|3|1W|5|6|7|3N|8|@]|9|@]|C|$]]|$1|1X|3|1Y|5|1N|7|3O|8|@]|9|@]|C|$]]|$1|1Z|3|-4|5|6|7|3P|8|@]|9|@]|C|$]]|$1|20|3|21|5|6|7|3Q|8|@]|9|@]|C|$]]|$1|22|3|23|5|6|7|3R|8|@]|9|@]|C|$]]|$1|24|3|-4|5|6|7|3S|8|@]|9|@]|C|$]]]|25|$26|$5|27|28|29|C|$2A|2B]]|2C|$5|27|28|29|C|$2A|2D]]|2E|$5|27|28|29|C|$2A|2F]]]]

You can use groupBy of <a href="https://github.com/a8m/angular-filter" rel="noreferrer">angular.filter</a> module. 
so you can do something like this:

JS:

<pre><code>$scope.players = [
 {name: 'Gene', team: 'alpha'},
 {name: 'George', team: 'beta'},
 {name: 'Steve', team: 'gamma'},
 {name: 'Paula', team: 'beta'},
 {name: 'Scruath', team: 'gamma'}
];
</code></pre>

HTML:

<pre><code>&lt;ul ng-repeat="(key, value) in players | groupBy: 'team'"&gt;
 Group name: {{ key }}
 &lt;li ng-repeat="player in value"&gt;
 player: {{ player.name }} 
 &lt;/li&gt;
&lt;/ul&gt;
</code></pre>

RESULT: 
 Group name: alpha 
 * player: Gene 
 Group name: beta 
 * player: George 
 * player: Paula 
 Group name: gamma 
 * player: Steve 
 * player: Scruath 

UPDATE: <a href="http://jsbin.com/weyov/45/edit?html,js,output" rel="noreferrer">jsbin</a> Remember the basic requirements to use <code>angular.filter</code>, specifically note you must add it to your module's dependencies:

<blockquote>
 (1) You can install angular-filter using 4 different methods:
 
 <ol>
 <li>clone &amp; build this repository</li>
 <li>via Bower: by running $ bower install angular-filter from your terminal</li>
 <li>via npm: by running $ npm install angular-filter from your terminal</li>
 <li>via cdnjs <a href="http://www.cdnjs.com/libraries/angular-filter" rel="noreferrer">http://www.cdnjs.com/libraries/angular-filter</a></li>
 </ol>
 
 (2) Include angular-filter.js (or angular-filter.min.js) in your index.html, after including Angular itself.
 
 (3) Add 'angular.filter' to your main module's list of dependencies.
</blockquote>

blocks|key|196362|text|更新|type|unstyled|depth|inlineStyleRanges|entityRanges|data|196363|我最初写这个答案是因为Ariel+.+when+combined+with+other+$filters建议的解决方案的旧版本触发了""+(infdig)。幸运的是，这个问题已经在最新版本的angular.filter中得到了解决。|offset|length|style|CODE|196364|我建议使用以下实现：that+didn't+have+that+issue|196365|angular.module("sbrpr.filters",+[])
.filter('groupBy',+function+()+{
++var+results={};
++++return+function+(data,+key)+{
++++++++if+(!(data+&&+key))+return;
++++++++var+result;
++++++++if(!this.$id){
++++++++++++result={};
++++++++}else{
++++++++++++var+scopeId+=+this.$id;
++++++++++++if(!results[scopeId]){
++++++++++++++++results[scopeId]={};
++++++++++++++++this.$on("$destroy",+function()+{
++++++++++++++++++++delete+results[scopeId];
++++++++++++++++});
++++++++++++}
++++++++++++result+=+results[scopeId];
++++++++}

++++++++for(var+groupKey+in+result)
++++++++++result[groupKey].splice(0,result[groupKey].length);

++++++++for+(var+i=0;+i<data.length;+i%2B%2B)+{
++++++++++++if+(!result[data[i][key]])
++++++++++++++++result[data[i][key]]=[];
++++++++++++result[data[i][key]].push(data[i]);
++++++++}

++++++++var+keys+=+Object.keys(result);
++++++++for(var+k=0;+k<keys.length;+k%2B%2B){
++++++++++if(result[keys[k]].length===0)
++++++++++++delete+result[keys[k]];
++++++++}
++++++++return+result;
++++};
});|code-block|syntax|javascript|196366|但是，此实现仅适用于Angular+1.3之前的版本。(我将很快更新此答案，提供适用于所有版本的解决方案。)|196367|实际上我已经wrote+a+post+about+the+steps+that+I+took+to+develop+this+$filter,+the+problems+that+I+encountered+and+the+things+that+I+learned+from+it了。|196368|entityMap|0|LINK|mutability|MUTABLE|url|http://plnkr.co/edit/Mo4PdOd3s0VQlhc68VvH?p=preview|1|https://docs.angularjs.org/error/$rootScope/infdig|2|https://github.com/a8m/angular-filter|3|http://plnkr.co/edit/Trr3dIEplKxODk4WpqTr?p=preview|4|http://sobrepere.com/blog/2014/10/14/creating-groupby-filter-angularjs/^0|0|18|7|1Y|6|J|X|0|1U|B|1|2N|E|2|0|A|R|3|0|0|0|1R|7|6|3R|4|0^^$0|@$1|2|3|4|5|6|7|18|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|19|8|@$D|1A|E|1B|F|G]|$D|1C|E|1D|F|G]]|9|@$D|1E|E|1F|1|1G]|$D|1H|E|1I|1|1J]|$D|1K|E|1L|1|1M]]|A|$]]|$1|H|3|I|5|6|7|1N|8|@]|9|@$D|1O|E|1P|1|1Q]]|A|$]]|$1|J|3|K|5|L|7|1R|8|@]|9|@]|A|$M|N]]|$1|O|3|P|5|6|7|1S|8|@]|9|@]|A|$]]|$1|Q|3|R|5|6|7|1T|8|@$D|1U|E|1V|F|G]]|9|@$D|1W|E|1X|1|1Y]]|A|$]]|$1|S|3|-4|5|6|7|1Z|8|@]|9|@]|A|$]]]|T|$U|$5|V|W|X|A|$Y|Z]]|10|$5|V|W|X|A|$Y|11]]|12|$5|V|W|X|A|$Y|13]]|14|$5|V|W|X|A|$Y|15]]|16|$5|V|W|X|A|$Y|17]]]]

<h1>Update</h1>
I initially wrote this answer because the old version of the solution suggested by Ariel M. <a href="http://plnkr.co/edit/Mo4PdOd3s0VQlhc68VvH?p=preview" rel="noreferrer">when combined with other <code>$filter</code>s</a> triggered an <a href="https://docs.angularjs.org/error/$rootScope/infdig" rel="noreferrer">&quot;Infite $diggest Loop Error&quot; (<code>infdig</code>)</a>. Fortunately this issue has been solved in the latest version of the <a href="https://github.com/a8m/angular-filter" rel="noreferrer">angular.filter</a>.
I suggested the following implementation, <a href="http://plnkr.co/edit/Trr3dIEplKxODk4WpqTr?p=preview" rel="noreferrer">that didn't have that issue</a>:
<pre><code>angular.module(&quot;sbrpr.filters&quot;, [])
.filter('groupBy', function () {
 var results={};
 return function (data, key) {
 if (!(data &amp;&amp; key)) return;
 var result;
 if(!this.$id){
 result={};
 }else{
 var scopeId = this.$id;
 if(!results[scopeId]){
 results[scopeId]={};
 this.$on(&quot;$destroy&quot;, function() {
 delete results[scopeId];
 });
 }
 result = results[scopeId];
 }

 for(var groupKey in result)
 result[groupKey].splice(0,result[groupKey].length);

 for (var i=0; i&lt;data.length; i++) {
 if (!result[data[i][key]])
 result[data[i][key]]=[];
 result[data[i][key]].push(data[i]);
 }

 var keys = Object.keys(result);
 for(var k=0; k&lt;keys.length; k++){
 if(result[keys[k]].length===0)
 delete result[keys[k]];
 }
 return result;
 };
});
</code></pre>
However, this implementation will only work with versions prior to Angular 1.3. (I will update this answer shortly providing a solution that works with all versions.)
I've actually <a href="http://sobrepere.com/blog/2014/10/14/creating-groupby-filter-angularjs/" rel="noreferrer">wrote a post about the steps that I took to develop this <code>$filter</code>, the problems that I encountered and the things that I learned from it</a>.

blocks|key|196379|text|除了接受的答案之外，如果您想要按多列进行分组，还可以使用此选项|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|196380|<ul+ng-repeat="(key,+value)+in+players+%7C+groupBy:+'[team,name]'">|code-block|syntax|javascript|196381|entityMap^0|G|2|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|P|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|Q|8|@]|D|@]|E|$]]]|L|$]]

In addition to the accepted answer you can use this if you want to group by multiple columns:

<pre><code>&lt;ul ng-repeat="(key, value) in players | groupBy: '[team,name]'"&gt;
</code></pre>

blocks|key|3040270|text|如果您需要在js代码中使用它。你可以使用angula-filter库的注入方法。就像这样。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3040271|function+controller($scope,+$http,+groupByFilter)+{+++++

+++var+groupedData+=+groupByFilter(originalArray,+'groupPropName');

}|code-block|syntax|javascript|3040272|https://github.com/a8m/angular-filter/wiki/Common-Questions#inject-filters|offset|length|3040273|entityMap|0|LINK|mutability|MUTABLE|url^0|0|0|0|22|0|0^^$0|@$1|2|3|4|5|6|7|R|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|S|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|T|8|@]|9|@$I|U|J|V|1|W]]|A|$]]|$1|K|3|-4|5|6|7|X|8|@]|9|@]|A|$]]]|L|$M|$5|N|O|P|A|$Q|H]]]]

If you need that in js code. You can use injected method of angula-filter lib. 
Like this.

<pre><code>function controller($scope, $http, groupByFilter) { 

 var groupedData = groupByFilter(originalArray, 'groupPropName');

}
</code></pre>

<a href="https://github.com/a8m/angular-filter/wiki/Common-Questions#inject-filters" rel="nofollow noreferrer">https://github.com/a8m/angular-filter/wiki/Common-Questions#inject-filters</a>

I have a list of players which belong to a group each. How can I use a filter to list the users per group?

<pre><code>[{name: 'Gene', team: 'team alpha'},
 {name: 'George', team: 'team beta'},
 {name: 'Steve', team: 'team gamma'},
 {name: 'Paula', team: 'team beta'},
 {name: 'Scruath of the 5th sector', team: 'team gamma'}];
</code></pre>

I'm looking for this result:

<ul>
<li>team alpha
<ul>
<li>Gene</li>
</ul></li>
<li>team beta
<ul>
<li>George</li>
<li>Paula</li>
</ul></li>
<li>team gamma
<ul>
<li>Steve</li>
<li>Scruath of the 5th sector</li>
</ul></li>
</ul>

How can I group data with an Angular filter?

我有一份球员名单，每个球员都属于一个组。如何使用筛选器列出每个组的用户？[{name: 'Gene', team: 'team alpha'}, {name: 'George', team: 'team beta'}, {name: 'Steve', team: 'team gamma'}, {name: 'Paula...

问如何使用角度过滤器对数据进行分组？
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何使用角度过滤器对数据进行分组？EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何使用角度过滤器对数据进行分组？
EN