In post we are lear about orderBy in Angularjs. we are giving you orderBy example with ng-repeat function. we are giving you best way for orderBy. Returns an array containing the items from the specified collection, ordered by a comparator function based on the values computed using the expression predicate.
For example, [{id: 'foo'}, {id: 'bar'}] | orderBy:'id' would result in [{id: 'bar'}, {id: 'foo'}].
orderBy function Syntax
{{ orderBy_expression | orderBy : expression : reverse : comparator }}
Search
Languages Name | Devloper Name |
---|---|
{{data.lang_name | lowercase }} | {{data.developer_name | lowercase }} |
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<div ng-app="" ng-init="live_data=[{lang_name:'Laravel',developer_name:'Mike',id:1},
{lang_name:'PHP',developer_name:'Jonh',id:2},
{lang_name:'Angularjs',developer_name:'Zip',id:3},
{lang_name:'Vuejs',developer_name:'Keti',id:4},
{lang_name:'Mysql',developer_name:'Meera',id:5},
{lang_name:'Javascript',developer_name:'Zil',id:6}]">
<p>Search <input class="form-control" ng-model="query_string" type="text"></p>
<table id="searchResults" class="table table-bordered">
<tbody><tr>
<th>Languages Name</th>
<th>Devloper Name</th>
</tr>
<tr ng-repeat="data in live_data | orderBy:'-id'">
<td>{{data.lang_name | lowercase }}</td>
<td>{{data.developer_name | lowercase }}</td>
</tr>
</tbody></table>
</div>