How do you update a value in local Storage array Angular 7

Question

What I am trying to do is update a single value in an array this is the code I have so far for it but it doesn't seem to be working correctly, was wondering if anyone would be able to help me with this.

So, how I think it works is it takes the index position from the ngFor as well as the auto-incrementing id for the array makes sure it has a match and pushes the new name to the array.

But that doesn't seem to be working, it executes the toastr to say it has been updated but it hasn't in the Local Storage

     public updateNameLocalStorage(Name, id, i ): void {
          const currentArray = this.storage.get(this.STORAGE_KEY);
          console.log(currentArray);
          for (i = 0; i < currentArray.length; ++i) {
               if (currentArray[i].id === id) {
                    currentArray.push({
                         Name: Name
                     });
                     // insert updated array to local storage
                     this.storage.set(this.STORAGE_KEY, currentArray);
                     this.notifiy.showInfo('Name Updated'  , '');
                } else {
                    this.notifiy.showFailure('Error'  , '');

                }

          }

This is the structure of the data

Eee https://stackoverflow.com/questions/3357553/how-do-i-store-an-array-in-localstorage — Adam Kosmala, Aug 20 '19 at 09:10
ok, but where do you determine that the value has not updated? I still don't see anything. Are you console logging it somewhere after setting the value? — AT82, Aug 20 '19 at 09:19
I'm sorry I don't understand I thought if I use an if statement to check if the id exists it changes the name and if not it sends a notification saying error — Conor Donohoe, Aug 20 '19 at 09:22
I'm sorry, I don't really understand. You are updating the storage value, showing the toast, but then you are doing nothing. So how do you know that the data is not updated? Also, what is `storage`? It doesn't seem to be `localStorage`. — AT82, Aug 20 '19 at 09:24
if you check the link I provided, you will see that you can't store arrays in localstorage, only strings — Adam Kosmala, Aug 20 '19 at 09:27
The array is stored in the browsers local Storage so to check if it's updated you just check the Dev Tools also it is localStorage — Conor Donohoe, Aug 20 '19 at 09:29

score 1 · Accepted Answer · answered Aug 20 '19 at 09:36

You are using push which appends an element to the end of an array. If you want to update a value with the given ID just access the index directly and override the value. Also if you just push {Name: Name} the object in the array has no property id anymore.

Something like this:

const currentArray = this.storage.get(this.STORAGE_KEY);
const index = currentArray.findIndex(e => e.id === id);
if(index >= 0) {
  currentArray[index] = {...currentArray[index], ...{Name:Name}}; 
  this.storage.set(this.STORAGE_KEY, currentArray);
  this.notifiy.showInfo('Name Updated'  , '');
} else {
  this.notifiy.showFailure('Error'  , '');
}

How do you update a value in local Storage array Angular 7

1 Answers1