Is there a way to organize a one-to-one object map in angular.js using filters (or any other technique) while working within an ng-repeat loop?
This is what I currently have:
obj:{
a:3,
c:5,
d:1,
g:15
}
Basically, I want to achieve something like this:
<div ng-repeat="item in obj | orderBy:'value'"> {{ item.value }}</div>
I am looking for a way to arrange that data presentation by either key or value. I understand that angular OrderBy only works with arrays and does not sort objects. However, if I could convert that object into an array of objects with key and value properties (possibly using a filter named 'toArray'):
var arr = [
{
key:'a',
value:'3'
},
{
key:'c',
value:5
},
....
]
then I would be able to implement something like this:
<div ng-repeat="item in obj | toArray | orderBy:'value'"> {{ item.value }}</div>
However, every attempt at creating such a filter has resulted in a '10 $digest() iterations reached. Aborting!' error due to the constant updating of the new array of objects on each iteration.
What is the most effective (or any) solution for sorting a one-to-one object map without the need to modify the data structure in the controller?