I have a working ng-repeat, that I would like to order by descending date (newest items first).
However, I can not seem to get it to work. I have double checked quoting, etc. I have tried orderBy:'createdate':reverse
, orderBy:'article.createdate':reverse
, and orderBy:'data.blog.article.createdate':reverse
None seem to work.
This is my view:
<article data-ng-if="article.id == post || post===NULL" data-ng-repeat="article in data.blog.article | orderBy:'createdate':reverse | slice:currentPage*pageSize:currentPage+1*pageSize"> <h2 class="blog-post-title"> <a href="#!/blog/{{article.id}}" title="Permalink to {{article.title.__cdata}}">{{article.title.__cdata}}</a> </h2> <span class="blog-post-meta">Posted on {{article.createdate | date:'MMMM dd, yyyy h:mma'}} by {{article.author}}</span> <div class="blog-post-content" ng-bind-html="article.content.__cdata">{{article.content.__cdata}}</div> </article>
Here is a sample of the data (converted to JSON from XML using X2JS):
{ "blog": { "article": [ { "id": "1", "author": "eat-sleep-code", "title": { "__cdata": "The first article." }, "content": { "__cdata": "\n This is my first article in my test site.\n " }, "createdate": "2014-05-09" }, { "id": "2", "author": "eat-sleep-code", "title": { "__cdata": "The second article." }, "content": { "__cdata": "\n This is my second article in my test site. This article's create date is actually earlier.\n " }, "createdate": "2014-05-08" } ] } }
The ng-repeat-start directive works the same as ng-repeat, but will repeat all the HTML code (including the tag it's defined on) up to and including the ending HTML tag where ng-repeat-end is placed.
To sort in descending order, set it as true . You can also use + to sort the data in an ascending and – the data in descending order also . Here with the filters in Angular JS, instead of displaying the various rows, we will be sorting it by ascending and descending order .
The JavaScript specification does not define the order of keys returned for an object, so AngularJS relies on the order returned by the browser when running for key in myObj. Browsers generally follow the strategy of providing keys in the order in which they were defined, although there are exceptions when keys are deleted and reinstated.
I ran into an issue today using the ngRepeat directive in AngularJS. ngRepeat let’s you iterate over a collection (array or object) and repeat a snippet of code for each of the items. Let’s look at a some examples first, before I get into my situation. Let’s assume we have an array of items set in our controller’s scope.
If you are hitting any of these limitations, the recommended workaround is to convert your object into an array that is sorted into the order that you prefer before providing it to ngRepeat. You could do this with a filter such as toArrayFilteror implement a $watchon the object yourself. Tracking and Duplicates
However, there are a few limitations compared to array iteration: The JavaScript specification does not define the order of keys returned for an object, so AngularJS relies on the order returned by the browser when running for key in myObj.
The reverse
argument should be a boolean value.
Assuming you don't have reverse set to true or false somewhere in your controller, you should replace
orderBy:'createdate':reverse
with
orderBy:'createdate':true
Demo
orderBy docs
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With