2017-12-18 15 views
1

https://github.com/PillowPillow/ng2-webstorageローカルストレージがAngular2を使用してリフレッシュした後は動作しません、インメモリ・データ

マイベースプロジェクトは現在Tours of Heroes

から構成されているが、私は中に値を保存することができていますWebstorageを使用してそれらを取得します。メモリ内の-data.service

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

:しかし、リフレッシュした後、私の値は、インメモリー・data.service.ts

bot.component.htmlで保存した古いものに戻します。 TS:

import { InMemoryDbService } from 'angular-in-memory-web-api'; 

export class InMemoryDataService implements InMemoryDbService { 
    createDb() { 
    const bots = [ 
    {"id":1,"lastLevel":5}, 
    {"id":2,"lastLevel":5}, 
    {"id":3,"lastLevel":5} 
]; 
    return {bots}; 
    } 
} 

botlevelup.component.html

Bot: {{bot.id}} 
Last Level: <input [(ngModel)]="bot.lastLevel" /> 
<button (click)="save()">Save</button> 

botlevelup.component.ts

更新された値がコンソールログを使用して 'boundValue'に保存されていることがわかりました。

更新後、元のin-memory-data.service.tsではなく、「boundValue」から更新された値を取得するにはどうすればよいですか?

私は他の場合には達成したい:

  1. ボット1及び2に加えられた変更がある場合はボット3に行われた変更がない場合、それはboundValue "
  2. から取得します、それはin-memory-data.serviceから検索します。

編集#1:私はアップデートがない場合、ボットの更新された値、およびボットのも古い値に基づいてテーブルをバック返すためにマネージド検索

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

IIFCでは、それぞれの 'bot'オブジェクトのキーとして' boundValue'を使用していますよね?その場合、最後の更新は、 'boundValue'に関連付けられた以前の値が上書きされたb/cを見る唯一のものです。 – bazzells

+0

私は両方のボットを既にboundValueに格納することができました。リフレッシュ後にボットを表示するのはどうですか? – icedmilocode

+0

どのようにデータをストレージから取得しようとしましたか?パッケージdocsからretrieveメソッドを使用しましたか? – bazzells

答えて

0

のコードスニペット。ローカルストレージ内のボットの

ストア元の値:

スニペット:

export const bots: Bot[] = [ 
{"id":1,"lastLevel":5}, 
{"id":2,"lastLevel":5}, 
{"id":3,"lastLevel":5} 
] 

var local = JSON.stringify(bots); 
this.storage.store('localstore', local); 

は、すべての変更を保存することがboundValueある質問で、値の更新のためのローカルストレージを作成します。

this.storage.store('boundValue', JSON.stringify(bot)); 

がlocalstoreとboundValueから値を取得し、boundValueで更新があるかどうかをチェックし、もしあればアップデートをlocalstoreを交換してください。

var newValues = this.storage.retrieve('boundValue'); 
    var oldValues = this.storage.retrieve('localstore '); 

新しい値がない場合は、古い値を返します。

エルス
if(boundValue == null){   
    var array = $.parseJSON(oldValues); 
} 

、配列内の古い値を更新します:最後に

else{ 
     var valueUpdate = $.parseJSON('[' + newValues + ']'); 
     var array  = $.parseJSON(oldValues); 

     for (var i=0; i<array.length; i++){ 
     for (var m=0; m<valueUpdate.length; m++){ 
      if (valueUpdate[m].id == array[i].id){ 
      array[i] = valueUpdate[m]; 
      break; 
      } 
     } 
     }  
    } 

this.bots = array; 

は、それが最善ではないかもしれない私は、これらの値の変数 '配列' を使用しますしかし、それは私が思い付くことができるものです。どのように私がそれを行うことができるか私にアイデアを与えた私の質問のすべてのコメントありがとう。

関連する問題