How to change the order of object( not array ) in angular js

Question

I have one set of object(key value pair )

var data  = {
         "AnomalyEnableLatch": "false",
        "DistLogPeriod": "0",
        "AedCooldown": "0",
        "AedEnableLatch": "false",
        "AedGuardBand": "0",
        "AedSensitivity": "0",
        "AedWindowSize": "0",
        "AnomalyCurrentNoiseFloor": "10",
        "AnomalyGuardBandSize": "32",
        "AnomalyKsigToStart": "40",
        "AnomalyMinSnrToStop": "100",
        "AnomalyWindowSize": "651"
    };

This list will be dynamic one.

I need to order by two params

one is starts with aed and another set starts with anomaly.

Actually, i am getting correct order from api response. While working on js, order changing automatically by asc.

It should not do like this. I need to do work on actual order.

Otherwise i need to change the order. I need a order as given in above set

http://jsfiddle.net/MohaideenIsmail/ADukg/11659/

You **cannot** order keys of object. But you can order the way you access them. Try `keys = Object.keys(obj); keys.sort(...your logic to sort...)` and not access it — Rajesh, Jun 12 '17 at 05:55
are you asking for an array of objects [{},{},{}]? or an array of arrays [[],[],[]] — Rick, Jun 12 '17 at 06:00

score 0 · Answer 1 · answered Jun 12 '17 at 06:13

0

Actually, the order is not changing. But the console will show like that.

Just observe console.log(Object.keys(data)) before using filter. It's just un ordered array of object properties. Now, if you want to sort alphabetically, then

you could do is use Object.keys(), and sort the Array, then iterate it through object.

Object.keys(data)
      .sort() // sort keys alphabetically
      .forEach(function(v, i) {
          console.log(v, data[v]); // access properties(keys) alphabetically
       });

answered Jun 12 '17 at 06:13

Mr_Perfect

6,986
9
30
59

1

Just FYI, people over 10k can see deleted answer and its not good to delete a downvoted answer and then adding another one. Instead, update the same answer with the given feedback. – Rajesh Jun 12 '17 at 06:16
I thought the same but even I have to delete one to update another now. – Mr_Perfect Jun 12 '17 at 06:17
1

That was a general feedback. – Rajesh Jun 12 '17 at 06:18

score 0 · Answer 2 · answered Jun 12 '17 at 06:13

As commented, you cannot sort/order keys in object. But you can order the way you access the keys.

You can use following JSFiddle to debug or following SO snippet.

var myApp = angular.module('myApp', []);

//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});

function MyCtrl($scope) {
  $scope.name = 'Superhero';

  $scope.data = {
    "AnomalyEnableLatch": "false",
    "DistLogPeriod": "0",
    "AedCooldown": "0",
    "AedEnableLatch": "false",
    "AedGuardBand": "0",
    "AedSensitivity": "0",
    "AedWindowSize": "0",
    "AnomalyCurrentNoiseFloor": "10",
    "AnomalyGuardBandSize": "32",
    "AnomalyKsigToStart": "40",
    "AnomalyMinSnrToStop": "100",
    "AnomalyWindowSize": "651"
  };

  $scope.keys = Object.keys($scope.data);

  $scope.keys.sort(function(a, b) {
    return getDifference(a, b, "Aed") || getDifference(a, b, "Anomal") || a.localeCompare(b)
  });

  function getDifference(a, b, s) {
    return b.startsWith(s) - a.startsWith(s)
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.11/angular.min.js"></script>

<div ng-app>
  <div ng-controller="MyCtrl">
    Hello, {{name}}!
    <div>
      <ul>
        <li ng-repeat="k in keys">
          {{k}} : {{ data[k] }}</li>
      </ul>
    </div>
  </div>
</div>

score 0 · Answer 3 · answered Jun 12 '17 at 06:42

The order of keys in a JavaScript object is not guaranteed. There are two possible ways to approach this:

The keys and their order are known before: In this case, predefine your array of keys and use Array.prototype.map to build an ordered array from your data map.
If the keys are dynamic too, use Object.keys to extract the keys, sort them as needed using Array.prototype.sort(compareFn). Then, you can use this sorted key array as described in method 1

Sample Code for getting an ordered array out of a map given an ordered set of keys:

var data = {...}; //Original data map

var orderedKeys = ["firstKey", "secondKey"]; //Array of preordered keys

var sortedArrayOfMaps = orderedKeys.map(function(key){var o={}; o[key]=data[key]; return o;}) //Use map to get ordered array of objects

I have also updated the JS Fiddle using this method for your reference

How to change the order of object( not array ) in angular js

3 Answers3