Question

这是我表格中的一栏。它显示了结束日期。我需要在点击列标题时对它们进行排序。

<th class="Theader">
<a href="" ng-click="predicate = 'endDate'; reverse=reversesort;reversesort=!reversesort" class="blackfont" style="color: #656565;" title="Click to sort">
  End Time
</a>
<span class="ordermenu fa fa-sort-asc" ng-show="!reversesort"></span><span class="ordermenu fa fa-sort-desc" ng-show="reversesort"></span>
</th>

Answer 1

    <div ng:controller="Main"><table>
<tr>
<th><a href ng:click="sortBy('age')">Age</a></th>
<th><a href ng:click="sortBy('date')">Date</a></th>
</tr>
<tr ng:repeat="friend in friends.$orderBy(sort, reverse)">
<td>{{friend.age}}</td>
<td>{{friend.date}}</td>

</tr> </table> </div>

function Main() {
this.friends = [{
    age: 10,
    date: '11 June 2011'},
{
    age: 19,
    date: '12 June 2011'},
{
    age: 21,
    date: '13 July 2011'},
{
    age: 35,
    date: '14 May 2011'},
{
     age: 29,
     date: '15 June 2011'}];

}

Main.prototype = {

sort: function(item) {
    if (this.predicate == 'date') {
        return new Date(item.date);
    }
    return item[this.predicate];
},

sortBy: function(field) {
    if (this.predicate != field) {
        this.predicate = field;
        this.reverse = false;
    } else {
        this.reverse = !this.reverse;
    }
},

reverse: false

};

请参阅此小提琴FIDDLE

来源：Sortable table columns with AngularJs

您也可以参考this fiddle too.

我想在我的专栏中对日期进行排序

1 个答案: