Menu
I'm using Angular JS and Google Places API to build an web app.
I have an ng-repeat which is currently being ordered by "rating" descending(orderBy:'-rating'). So it will list x places from the Google Places API JSON file in the descending order based on the rating.
HOWEVER, items/places that don't have a rating are classed as null and these entries are shown at the top of my ng-repeat feed. These should go to the bottom of the feed as they don't have a rating?
So an example of how i'd like this it to look is:
<ng-repeat orderBy:'-rating'>
<place rating="5"/>
<place rating="4.2"/>
<place rating="2.8"/>
<place rating="null"/>
<place rating="null"/>
</ng-repeat>
What's the best way of going about this?
721
Definition and Usage The orderBy filter allows us to sort an array. By default, strings are sorted alphabetically, and numbers are sorted numerically.
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 .
Track by $index in AngularJS The ngRepeat track by $index allows you to specify which items should be repeated using their index number. The ngRepeat is a directive that can be added to the HTML template of an Angular application. It is used for creating lists, and it can take an expression as an argument.
Disabling sorting If we want to prevent the user from changing the order of any column, then we have to use the matSortDizable bindings when disabled on mat-sort or on the mat-sort-header.
To sort with null or undefined value using orderBy filter. use [] notation orderBy:[ '!rating', '-rating', ].
That will show null or undefined value at the bottom.
like:
<li ng-repeat="option in options | orderBy:[ '!rating', '-rating', ]">{{option.name}}</li>
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
