抱歉，我还在学习 Angular，
我需要开发一个按排名排序的小组赛阶段(如下图所示)，但您的排名取决于您的获胜和失败。
我不知道我该怎么做。 =/
这是我的代码 http://plnkr.co/edit/Q5YtEBjFDjEQ14YXdhii?p=preview
app.controller('marshalLeagueCtrl', function($scope) {
$scope.groups = {
groups: [
{
name: "GRUPO A",
teams: [
{
name: "Time 1",
link: "http://www.google.com",
wins: 5,
loses: 2
},
{
name: "Time 2",
link: "http://www.google.com",
wins: 5,
loses: 2
},
{
name: "Time 3",
link: "http://www.google.com",
wins: 5,
loses: 2
},
{
name: "Time 4",
link: "http://www.google.com",
wins: 5,
loses: 2
}
]
},
{
"name": "GRUPO B",
teams: [
{
name: "Time 1",
link: "http://www.google.com",
wins: 5,
loses: 2
},
{
name: "Time 2",
link: "http://www.google.com",
wins: 5,
loses: 2
},
{
name: "Time 3",
link: "http://www.google.com",
wins: 5,
loses: 2
},
{
name: "Time 4",
link: "http://www.google.com",
wins: 5,
loses: 2
}
]
},
{
name: "GRUPO C",
teams: [
{
name: "Time 1",
link: "http://www.google.com",
wins: 5,
loses: 2
},
{
name: "Time 2",
link: "http://www.google.com",
wins: 5,
loses: 2
},
{
name: "Time 3",
link: "http://www.google.com",
wins: 5,
loses: 2
},
{
name: "Time 4",
link: "http://www.google.com",
wins: 5,
loses: 2
}
]
},
{
name: "GRUPO D",
teams: [
{
name: "Time 1",
link: "http://www.google.com",
wins: 5,
loses: 2
},
{
name: "Time 2",
link: "http://www.google.com",
wins: 5,
loses: 2
},
{
name: "Time 3",
link: "http://www.google.com",
wins: 5,
loses: 2
},
{
name: "Time 4",
link: "http://www.google.com",
wins: 5,
loses: 2
}
]
}
]
};
});
<section class="container group-stage league-page" ng-controller="marshalLeagueCtrl">
<div class="row">
<div class="col-sm-12">
<h2>Group Stage</h2>
</div>
<div class="col-sm-12">
<div class="row">
<div class="group-area col-sm-6" ng-repeat="group in groups.groups">
<div class="group-box col-sm-12">
<h3 class="rank-header">{{group.name}}</h3>
<div class="row rank-labels">
<div class="col-sm-2">RANK</div>
<div class="col-sm-6"> </div>
<div class="col-sm-2 text-center">V</div>
<div class="col-sm-2 text-center">D</div>
</div>
<div class="row rank-team" ng-repeat="team in group.teams">
<div class="col-sm-2 text-center">1</div>
<div class="col-sm-6">
<a href="{{team.link}}">{{team.name}}</a>
</div>
<div class="col-sm-2 text-center">{{team.wins}}</div>
<div class="col-sm-2 text-center">{{team.loses}}</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
最佳答案
带有 Angular 滤镜!
循环遍历数组并向数组添加一个属性，确定排名。您还可以创建自定义过滤器，但我假设您想要在其他地方显示排名数字。创建下面的函数，并使用 for 循环遍历数据结构，分析数据并附加排名数字。
$scope.addRank = function(person){..../////ranking code here////.....}
所以排名最终会是这样的。
{
name: "Time 4",
link: "http://www.google.com",
wins: 5,
loses: 2,
ranking: 4,
//or any number that is determined by your algorithm
}
一旦你拥有了这个属性，对于 Angular 来说，使用过滤器对数据进行排序就是一个简单的壮举!使用 orderBy 过滤器。过滤器负责如何显示从 Controller 获得的数据。
<div class="group-area col-sm-6" ng-repeat="group in groups.groups | orderBy: 'rank'">
不要忘记排名周围的引号!
关于javascript - AngularJS 小组赛阶段按排名排序，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34707114/