How delete object in array Angular JS?

Question

I have an object:

$scope.obj = {
  name : "ok",
  list : [{object},{object2}]
}

So, I have {object1}. How can I remove this object from list if I dont know key?

My code is:

var indexToDelete = list.people.keys(item);
console.log(indexToDelete);
delete list.people[indexToDelete];

Item is:

Object
$$hashKey:
"object:29"
artist:""
cover:""
song:"Basta 1"
source:""
type:"9"

Your list is an array, so to delete any element you can use splice: http://stackoverflow.com/questions/5767325/how-to-remove-a-particular-element-from-an-array-in-javascript — Bagofjuice, Feb 02 '17 at 17:39
use the $index of ng-repeat, and use splice() to remove the selected index... — Joao Polo, Feb 02 '17 at 17:46
Can you be more specific about what exactly {object1} is? As in, is it literally a reference to the same object that is inside `list[]`? Or do you need to determine whether one of the objects in `list[]` just has the same properties and values as {object1}? http://stackoverflow.com/questions/201183/how-to-determine-equality-for-two-javascript-objects — Daniel Beck, Feb 02 '17 at 19:04

score 1 · Accepted Answer · edited May 23 '17 at 11:46

I'm going to simplify your data structure just a bit, for clarity. I'm also going to assume that the $$hashKey can be used to determine whether the object to be removed is the same as one in the list -- if that's not the case, and we need to compare all the keys and parameters within the objects, the answer gets quite a bit more complex.

Given those assumptions, here is a vanilla javascript version that should work in all current browsers:

var list = [
    {$$hashKey: 1,  artist: "Alice"},
    {$$hashKey: 42, artist: "Bob"},
    {$$hashKey: 25, artist: "Charlie"}
];

var itemToRemove = {$$hashKey: 42, artist: "Bob"};

for (var i=0; i<list.length;i++) {
  if (list[i].$$hashKey == itemToRemove.$$hashKey) {
    list.splice(i,1); // removes the matched element
    i = list.length;  // break out of the loop. Not strictly necessary
  }
}

console.log(list);

You could simplify that somewhat if itemToRemove is a reference to an object that is in the list; in that case you can just compare them directly instead of depending on $$hashKey:

var obj1 = {$$hashKey: 1,  artist: "Alice"},
    obj2 = {$$hashKey: 42, artist: "Bob"},
    obj3 = {$$hashKey: 25, artist: "Charlie"};

var list = [obj1, obj2, obj3];
var itemToRemove = obj2;

for (var i=0; i<list.length;i++) {
  if (list[i] === itemToRemove) {
    list.splice(i,1); // removes the matched element
    i = list.length;  // break out of the loop. Not strictly necessary
  }
}

console.log(list);

(If you are transpiling from ES6 there are quite a few new convenience methods available so that you don't need to iterate through the array manually: array.prototype.findIndex, array.prototype.filter for example, but these are not currently supported in enough browsers to be usable in production. Alternatively, if you are willing to add a library such as underscore.js, you could use _.without() to remove specific elements.)

score 0 · Answer 2 · answered Feb 03 '17 at 08:12

Try array splice() method.

The splice() method changes the content of an array by removing existing elements and/or adding new elements.

Working demo :

var obj = {
    name : "ok",
    list : [
          {"name":"abc"},
          {"name":"xyz"}
    ]
}

obj.list.splice(0, 1); 

console.log(obj);

score 0 · Answer 3 · answered Feb 03 '17 at 08:37

There is two case 1. If you have already value as same as you want remove from array then do this

  $scope.obj = {
    name : "ok",
    list : [{object},{object2}]
    }
    var index  =$scope.obj.list.indexOf({object});
    $scope.obj.list.splice(index,1);

2. If it is fix that you want to remove first element of array then do this

$scope.obj.list.splice(0,1);

Abhinav Galodha · Answer 4 · 2017-02-02T19:31:24.543

-1

You can make use of the delete keyword and then the property which needs to be deleted.

So, if you need to delete Object1, Firstly, using the findIndex method find the index in the list and then you can use delete.

var indexToDelete = $scope.obj.list.findIndex(YourCriteria); delete $scope.obj.list[indexToDelete];

Note: findIndex is part of the ES7 Draft specification, so certain browsers might not support this method.

Edit1: To bring more clarity, the findIndex method takes a callback which is called for each value in the Array.

edited Feb 02 '17 at 19:31

answered Feb 02 '17 at 17:40

Abhinav Galodha

9,293
2
31
41

I get an error: `TypeError: # – Darama Feb 02 '17 at 18:25
$scope.obj.list is: `Array[3] 0 : Object $$hashKey : "object:31" artist : "" cover : "" song : "dnd-callback Custom callback that is passed to dropzone callbacks and can be used to communicate between source and target scopes. The dropzone can pass user defined variables to this callback. This can be used to transfer objects without serialization, see Demo." source : "" type : "9"` – Darama Feb 02 '17 at 18:27
`findIndex` is not really usable at this time; "Certain browsers might not support this" in this case means any version of IE. This answer also glosses over the fact that `YourCriteria` needs to be a function, not an object: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex – Daniel Beck Feb 02 '17 at 18:56
(not to mention that function would have to contain code for "are these objects equal", which is the nontrivial part of the question...) – Daniel Beck Feb 02 '17 at 19:07
@DanielBeck, i did not mention anywhere the `yourCriteri`a is an object. Also, the OP has not originally posted a lot of code but just the first code block. This answer should provide a direction how to proceed further to look for an answer. – Abhinav Galodha Feb 02 '17 at 19:28
@Agalo You didn't mention anything at all about `yourCriteria`, hence the confusion in @Darama's first two comments above. "a direction how to proceed further to look for an answer" is not really much of an answer. – Daniel Beck Feb 02 '17 at 19:35

How delete object in array Angular JS?

4 Answers4