LocalStorage for multiple fields with Angular2

Question

I am following this example: https://github.com/PillowPillow/ng2-webstorage This works fine for me as boundValue is stored and I can retrieve it. However, I have a list of bots:

bot.component.html

<tr *ngFor="let bot of bots" 
        routerLink="/botlevelup/{{bot.id}}">
            <td>{{bot.id}}</td>
            <td>{{bot.lastLevel}}</td>
</tr>

botlevelup.component.html

Last Level: {{boundValue}}
<input [(ngModel)]="bot.lastLevel" /> 

botlevelup.component.ts

this.storage.store('boundValue', this.bot.lastLevel);

How can I make use of webstorage to store values for all of my bots?

Edit #1: I followed Tours of Heroes as well and I am able to change the values which only retains for the session.

Edit #2: Original getBots snippet that display all bots:

  getBots(): Observable<Bot[]> {
      return this.http.get<Bot[]>(this.botsUrl)
      .pipe(
      catchError(this.handleError('getBots', []))
    );
  }

Answer 1

You can directly store it inside the local storage as a object/array

just do it as follows,

this.storage.store('botsboundvalue', JSON.stringify(this.bots));