我一直试图找到一个答案并且一直无法这样做。我想知道是否有人知道如何在不使用第三方工具的情况下对ng-repeat中的以下数据(members
属性)进行排序。
$scope.element = {
'sortOrder' : '[0].value' // <-- what is wrong? =[
'members': [
[
{ 'name' : 'a', 'value' : 'some' },
{ 'name' : 'b', 'value' : 'value' },
{ 'name' : 'c', 'value' : 'another' },
{ 'name' : 'd', 'value' : 'value' }
],
[
{ 'name' : 'a', 'value' : 'other' },
{ 'name' : 'b', 'value' : 'stuff' },
{ 'name' : 'c', 'value' : 'cats' },
{ 'name' : 'd', 'value' : 'reddit' }
],
[
{ 'name' : 'a', 'value' : 'internets' },
{ 'name' : 'b', 'value' : 'bigdata' },
{ 'name' : 'c', 'value' : 'winwin' },
{ 'name' : 'd', 'value' : 'himom' }
]
]
}
因此,上述数据基本上代表了一个表。由于各种原因,数据无法重组。现在我有以下作为我的标记:
<table class="table">
<thead>
<tr>
<th ng-repeat="key in element.members[0]">
<a href="#" ng-click="element.sortOrder = '[' + $index + ']' + '.value'">{{ key.name }}</a>
</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="subelement in element.members | orderBy : element.sortOrder">
<td ng-repeat="element in subelement" ng-include src="template(element, true)">
</td>
</tr>
</tbody>
</table>
sortOrder
属性看起来......它可能是正确的?我查看了其他人们必须做这种事情的例子(他们使用的是命名属性而不是索引)我认为我可能会到达某个地方,但无济于事。
任何启蒙的话都会受到赞赏。谢谢!
答案 0 :(得分:1)
您不能将[0].value
与orderBy
一起使用,与orderBy
一起使用的字符串应该是您要排序的对象的属性。在您的情况下,您希望对数组数组进行排序,但[0].value
不是数组的属性,因此您的方法不起作用。
但是,orderBy
可以使用“Getter”函数从您正在排序的对象中获取值,因此您可以按照以下方式使用它:
控制器:
$scope.element = {
sortOrder: -1, // sortOrder is the index, -1 = unsorted
members: [...]
};
$scope.getValue = function(member) {
if ($scope.element.sortOrder < 0) {
return null; // keep members being unsorted
}
return member[$scope.element.sortOrder].value;
};
模板:
<table class="table">
<thead>
<tr>
<th ng-repeat="key in element.members[0]">
<a href="#" ng-click="element.sortOrder = $index">{{ key.name }}</a>
</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="subelement in element.members | orderBy : getValue">
<td ng-repeat="element in subelement" ng-include src="template(element, true)">
</td>
</tr>
</tbody>
</table>
以下是您可以使用的工作内容:http://plnkr.co/edit/bebYBCoa6zptOHNLVL9X