CODEWITHSUNDEEP
javascriptarraysangularjs
Alister Greenpan
Alister Greenpan

Reputation: 133

AngularJS/JavaScript Remove specific element from Localstorage array

I have an array in my LocalStorage that I manipulate with ngStorage. I am trying to remove items from there but when I use 

$localStorage.someArrayName.splice(id, 1);

only the first removed item works fine, then removing stop working as I would like to.

I also tried something like this:

        if (id === $localStorage.someArrayName.length) {
            $localStorage.someArrayName.pop();
        }

        else if (id === 0) {
            $localStorage.someArrayName.shift();
        }

        else {
            $localStorage.someArrayName.splice(id, 1);
        }

But I get even more buggy result

I tried from the example in https://github.com/gsklee/ngStorage like this:

delete $localStorage.someArrayName[id];

but it deletes the values and I get null,null,null values in my local storage array. And then I even get ng repeat error about duplicate values:

Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed...

I cannot handle it. I am not sure if it's some small issue or I am doing something fundamentally wrong. Can you give me some guidance? Thank you in advance!

This is how my array looks like saved in the localstorage:

[{"content":"something"},{"content":"else"}] //etc...

Upvotes: 2

Views: 4326

Answers (1)

Liam James
Liam James

Reputation: 414

So you are using ng-repeat for something and your ids are there. If you use $index as value for your id parameter when you remove at item from the array, your array numbering is not longer the same and the id is not what you expect to be.

You also do not need the pop() and shift() methods.

Asuming your ng-repeat is something like this:

<element ng-repeat="item in someThing">
    {{item.prop}} <childelem ng-click=delete($index)>delete</childelem>
</element>

and if your function is:

$scope.delete = function (id) {

    $localStorage.someArrayName.splice(id, 1);

};

Then you would need something like this:

<element ng-repeat="item in someThing">
    {{item.prop}} <childelem ng-click=delete(item)>delete item</childelem>
</element>

and:

$scope.delete = function (item) {

   $localStorage.someArrayName.splice($localStorage.someArrayName.indexOf(item), 1);

};

and this is going to remove the entire {"content":"something"} from your array.

No idea if this is the right direction of the problem and if this is the scenario, but I hope it will help you. Best regards!

Upvotes: 3

Related Questions