Using Angular service and not changing variable from function call

Question

I'm using an angular service to get a list of inventory items, check to see if an item is in that list, and remove it. However, I don't want to change the service variable itself, just the temporary value I create. Here is my code:

var inventoryItems = InventoryService.all();
console.log("inventorya: ", InventoryService.all());
inventoryItems.splice($index, 1);
console.log("inventoryb: ", InventoryService.all());

I expect InventoryService.all() to return the same value at all times, but it mutates the value returned. I've tried:

var inventoryItems = new Object(InventoryService.all());

but that doesn't appear to work either. What am I doing wrong?

rob · Accepted Answer · 2016-02-26 22:45:11Z

2

You can clone the array with angular.copy(). e.g.

var inventoryItems = angular.copy(InventoryService.all());

Or better yet you could copy the array from inside your InventoryService so you don't have to think about it when you are using it

answered Feb 26, 2016 at 22:45

rob

18.7k13 gold badges73 silver badges95 bronze badges

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

2 Comments

Organiccat Over a year ago

As a follow up, how would I get it so that anything calling Inventory.all would get updated after I update inventory (on purpose using another function like Inventory.add)

rob Over a year ago

You can't do that. You can either have everything that calls Inventory.all() share the same instance of the array (the way you had it originally) or you can have everything have it's own instance (the angular.copy() way).

Luis Perez · Accepted Answer · 2016-02-26 22:45:44Z

0

Sounds like InventoryService.all() returns an array. If you splice the array you alter the contents of the array. Since it's a reference to an array all references reflect those changes. Sounds like what you want is to return a copy of the array.

You can do that by calling Array.slice(). Like so:

var inventoryItems = InventoryService.all().slice();

answered Feb 26, 2016 at 22:45

Luis Perez

28.2k11 gold badges85 silver badges81 bronze badges

Comments

Justin Cuaresma · Accepted Answer · 2016-02-26 22:51:51Z

If InventoryService.all() returns an Object then you are assigning the Object reference to inventoryItems. You have to create a new Object or clone it.

Here's a fiddle for the test: http://jsfiddle.net/ew5hgkpx/

var test1 = testFactory.getObj();
console.log(test1); // returns [1,2]
//var test2 = testFactory.getObj().splice(0,1);
// test1 now return [2]

var test3 = Object.create(testFactory.getObj()).splice(0,1);
// test1 still returns [1,2]

Collectives™ on Stack Overflow

Using Angular service and not changing variable from function call

3 Answers 3

2 Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Related