按键对Angular中的JSON响应进行排序

Question

Alright, I've been stuck on this one for a while and can't find an adequate solution out there. Basically, I've grouped the posts by date server-side and I want to sort the groups by decending date in Angular. I'm assuming a custom filter is the way to go but I haven't been able to get it to work.

Here's some of the code:

JSON Response:

{"September 20th":[{"id":5,"title":"Test 1","url":"www.google.com","tagline":"Test tagline 1","created_at":"2014-09-20T19:30:44.672Z","updated_at":"2014-09-20T19:30:44.672Z","vote_count":5}],"September 21st":[{"id":6,"title":"Test 2","url":"www.google.com","tagline":"Test tagline 2","created_at":"2014-09-21T00:00:00.000Z","updated_at":"2014-09-20T19:32:41.409Z","vote_count":8}]}

HTML:

<section ng-controller='MainController'>
    <ul ng-repeat="(date, posts) in postList | filter?">
        <h1>{{ date }}</h1>
        <li ng-repeat='post in posts'>
            <p>{{ post.vote_count }}</p>
            <button ng-click='upvote(post)' ng-disabled='!currentUser || hasVoted(post.id)'></button>
            <a href="{{ post.url }}">{{ post.title }}</a>
        </li>
    </ul>  
</section>

This displays the information perfectly, just in the incorrect order of dates.

I appreciate any help you can give me!

Answer 1

It's a bit hacky, but it works:

Example

Html:

<section ng-controller='MainController'>
<ul ng-repeat="posts in postList | orderObjectBy:'created_at':true">
    <h1>{{ posts.__originalKey }}</h1>
    <li ng-repeat='post in posts'>
        <p>{{ post.vote_count }}</p>
        <button ng-click='upvote(post)' ng-disabled='!currentUser || hasVoted(post.id)'></button>
        <a href="{{ post.url }}">{{ post.title }}</a>
    </li>
</ul>  
</section>

CustomFilter:

.filter('orderObjectBy', function() {
  return function(items, field, reverse) {
    var filtered = [];
    angular.forEach(items, function(item, key) {
      item.__originalKey=key;
      filtered.push(item);
    });
    filtered.sort(function (a, b) {
      return (a[field] > b[field] ? 1 : -1);
    });
    if(reverse) filtered.reverse();
    return filtered;
  };
})