Alternative for remove() when using strict mode, filter using one element and hiding all other

Question

I am trying to remove all the items from a list except "Red" on a specific condition by using remove(), but when I debug, it gives error:

"Accessing the 'arguments' property of a function is not allowed in strict mode".

Is there a alternative for remove that I can use in this situation. Below is the code that I am using:

for (var k = 0; k < homeCtrl.List.length; k++) {
      if (homeCtrl.ColorList[k].name != 'Red') {
            homeCtrl.ColorList.remove[k];
      }
}

Please try searching before asking questions – charlietfl Jul 20 '16 at 14:26 — charlietfl, Jul 20 '16 at 14:26

score 1 · Accepted Answer · answered Jul 20 '16 at 14:06

1

Since you want to remove items from an array, you can simply use Array.prototype.filter():

var array = [  
   {  
      "id":1,
      "name":"Red"
   },
   {  
      "id":2,
      "name":"Blue"
   },
   {  
      "id":3,
      "name":"Red"
   },
   {  
      "id":4,
      "name":"Green"
   },
   {  
      "id":5,
      "name":"Red"
   }
];

var withoutRed = array.filter(function(value) {
  return value.name != "Red";
});

console.log(withoutRed);

answered Jul 20 '16 at 14:06

developer033

20,983
7
64
95

thank you for this suggestion this works perfect but in my case splice is a better option. – Programmermid Jul 20 '16 at 14:22

Shashank Agrawal · Answer 2 · 2016-07-20T14:15:40.907

You can use splice()

for (var k = 0; k < homeCtrl.List.length; k++) {
    if (homeCtrl.ColorList[k].name != 'Red') {
        homeCtrl.ColorList.splice(k, 1);
    }
}

See a dummy example below:

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

app.controller("FooController", function($scope) {

  var homeCtrl = this;
  homeCtrl.List = [{
    name: 'Yello'
  }, {
    name: 'Red'
  }, {
    name: 'green'
  }];
  
  homeCtrl.ColorList = angular.copy(homeCtrl.List);

  homeCtrl.remove = function() {
    for (var k = 0; k < homeCtrl.List.length; k++) {
      if (homeCtrl.ColorList[k] && homeCtrl.ColorList[k].name != 'Red') {
        homeCtrl.ColorList.splice(k, 1);
      }
    }
  }
});

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

<div ng-app="sa" ng-controller="FooController as fooCtrl">
  
  {{fooCtrl.ColorList}}
  <br><br>
  <a ng-click="fooCtrl.remove()" href="">Clear</a>
</div>

Thank you Shashank this is working beautifully. – Programmermid Jul 20 '16 at 14:19 — Programmermid, Jul 20 '16 at 14:19
Glad this worked!! Feel free to accept the answer – Shashank Agrawal Jul 20 '16 at 15:44 — Shashank Agrawal, Jul 20 '16 at 15:44

score -2 · Answer 3 · answered Jul 20 '16 at 14:07

It looks like you're coming across issues here because you're modifying the list that you're iterating over. Javascript doesn't like this. Try creating a new list instead, and then replacing the old one.

var myNewList = [];
for (var k = 0; k < homeCtrl.List.length; k++) {
                    if (homeCtrl.List[k].name === 'Red') {
                        myNewList.push(homeCtrl.List[k]);
                    }
// now myNewList only contains the 'Red' elements.

developer033's suggestion to use .filter is more elegant than keeping the loop. — timje, Jul 20 '16 at 14:09

Alternative for remove() when using strict mode, filter using one element and hiding all other

3 Answers3