Swap rows/indexes within a JavaScript array using AngularJS

Question

I have a custom directive that is holding an array of JavaScript objects.

The object is a little complex and lengthy but I will display something similar to point out my problem:

A JSON.stringify of this displays the following:

[
  {
    "Id": 1,
    "Name": "John Doe",
    "EMail": "[email protected]"
  },
  {
    "Id": 2,
    "Name": "Jim Doe",
    "EMail": "[email protected]"
  },
  {
    "Id": 3,
    "Name": "Jeff Doe",
    "EMail": "[email protected]"
  }
]

I am further using ng-repeat to display the values in a tabular form on my HTML.

The values are coming from an API call that fetches them from a database.

I want to swap - say the entire Object with Id 1 with the entire Object with Id 3 so that during my tabular display I can see Id 3 object details first and Id 1 object details last, without breaking any functionality.

What would be the best possible solution to do this within the frontend itself?

paulitto · Accepted Answer · 2016-12-15 03:56:55Z

1

How about just swapping them using a temp variable?

var arr = [{"Id":1,"Name":"John Doe","EMail":"[email protected]"},
 {"Id":2,"Name":"Jim Doe","EMail":"[email protected]"},
 {"Id":3,"Name":"Jeff Doe","EMail":"[email protected]"}]
 var tmpObj = arr[0];
 arr[0] = arr[2];
 arr[2] = tmpObj;

edited Dec 15, 2016 at 3:56

answered Dec 15, 2016 at 2:13

paulitto

4,6932 gold badges24 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

221b Over a year ago

I'm running a for loop since the number of objects is large, what would be the best way to switch it within the loop?

paulitto Over a year ago

just save indexes of elements you need to swap within the loop (by checking ids or names or whatever you need), and then swap them after the loop as I showed above

221b Over a year ago

jsfiddle.net/3mL70v4q/2 This is what I tried, it doesn't seem to be swapping anything though, what am I missing ?

paulitto Over a year ago

you need to save indexes, not the elements, see updated fiddle

Nhan · Accepted Answer · 2016-12-15 02:41:31Z

0

If you want to reverse the array, use Array.prototype.reverse()

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

app.controller("myController", function($scope) {
  var arr = [
    {
      "Id": 1,
      "Name": "John Doe",
      "EMail": "[email protected]"
    },
    {
      "Id": 2,
      "Name": "Jim Doe",
      "EMail": "[email protected]"
    },
    {
      "Id": 3,
      "Name": "Jeff Doe",
      "EMail": "[email protected]"
    }
  ];
  
  $scope.array = arr.reverse();

});

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

<div ng-app="myApp">
  <div ng-controller="myController">
    <div ng-repeat="item in array">
      {{item.Id}} - {{item.Name}} - {{item.EMail}}
    </div>
  </div>
</div>

answered Dec 15, 2016 at 2:41

Nhan

3,9356 gold badges35 silver badges41 bronze badges

1 Comment

221b Over a year ago

Nope it isn't reversing - it's more like swapping them based on indexes

Collectives™ on Stack Overflow

Swap rows/indexes within a JavaScript array using AngularJS

2 Answers 2

4 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related