sort array in angularjs
30,745
Solution 1
you need to have:
$scope.keys = $filter('orderBy')($scope.keys, 'key', false)
the order by filter returns a new array, it does not make changes to the passed array.
updated fiddle: http://jsfiddle.net/kjuemhua/17/
Solution 2
Remove the OrderBy from the html markup to display unordered list:
<div ng-app="sortModule" class="nav">
<div ng-controller="MainController">
<button ng-click="sort()">Sort
</button>
<div></div>
<div >
<ul>
<li ng-repeat="lang in languages">
<span>{{lang.name}}</span>
</li>
</ul>
</div>
</div>
</div>
Now using the button sort sort the list
var app = angular.module('sortModule', [])
app.controller('MainController', function($scope,$filter){
$scope.languages = [
{ name: 'English', image: '/images/english.png',key:2 },
{ name: 'Hindi', image: '/images/hindi.png',key:3 },
{ name: 'English', image: '/images/english.png',key:2},
{ name: 'Telugu', image: '/images/telugu.png',key:1 }];
var newLanguages = []
newLanguages = angular.copy($scope.languages);
$scope.sort = function(){
$scope.languages = []
$scope.keys = []
for(language in newLanguages) {
$scope.keys.push(newLanguages[language])
}
$scope.keys = $filter('orderBy')($scope.keys, 'key', false);
$scope.languages = $scope.keys;
console.log(JSON.stringify($scope.keys))
}
});
Author by
Syed
Updated on January 14, 2020Comments
-
Syed over 4 years
Im working on sorting on an array using Angular JS using orderBy. But still its not getting sorted on a particular key.
Here is the code
var app = angular.module('sortModule', []) app.controller('MainController', function($scope,$filter){ $scope.languages = [ { name: 'English', image: '/images/english.png',key:2 }, { name: 'Hindi', image: '/images/hindi.png',key:3 }, { name: 'English', image: '/images/english.png',key:2}, { name: 'Telugu', image: '/images/telugu.png',key:1 }]; var newLanguages = [] newLanguages = angular.copy($scope.languages); function sortImages() { $scope.languages = [] $scope.keys = [] for(language in newLanguages) { $scope.keys.push(newLanguages[language]) } $filter('orderBy')($scope.keys, 'key') console.log(JSON.stringify($scope.keys)) } sortImages();
});
Im planning to see sorting based on "key". telugu should come first, english next and hindi last.
-
Syed over 8 yearsYes, you're right. It was a silly mistake. If you have a better code for sorting, can you plz post it?
-
gaurav5430 over 8 yearsi am not sure why are you using 3 arrays and angular.copy. you could probably sort your original array.
-
gaurav5430 over 8 yearsalso...you don't have a sort function in controller in the fiddle
-
Syed over 8 yearsHey I did that click button. Its working. If you have an optimised one. Can you plz check it? Here is the new fiddle jsfiddle.net/SyedNizamChennai/kjuemhua/18