Order by Object key in ng-repeat
An option would be use an intermediate filter.
PLUNK AND Code Snippet
var app = angular.module('app', []);
app.controller('MainCtrl', function($scope) {
$scope.template = {
"0": { data: "ZERO" },
"1": { data: "ONE" },
"2": { data: "TWO" },
"3": { data: "TREE" },
"5": { data: "FIVE" },
"6": { data: "SIX" },
"10":{ data: "TEN" },
"11": { data: "ELEVEN" },
"12": { data: "TWELVE" },
"13": { data: "THIRTEEN" },
"20": { data: "TWENTY"}
}
});
app.filter('toArray', function() { return function(obj) {
if (!(obj instanceof Object)) return obj;
return _.map(obj, function(val, key) {
return Object.defineProperty(val, '$key', {__proto__: null, value: key});
});
}});<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.7.0/underscore.js"></script>
<body ng-app="app" ng-controller="MainCtrl">
<div ng-repeat="(key, value) in template| toArray | orderBy:key">{{key}} : {{value.$key}} : {{value.data}}</div>
<body>NOTE:
The above filter requires Underscore.js, if you don't use it, can rewrite the filter.
I think it sorts itself out with a conversion to an array. pun intended.
var obj = {"3": {three:3}, 2: {two:2}, "5": {five:5}, 4: {four:4},
1: {one:1}, 6: {six:6}, 10: {ten:10}, 11:{eleven:11}
}
$scope.arr = [];
for (var o in obj)
$scope.arr.push(obj[o])