このようなローカル ストレージ サービスを作成しました。
import Ember from 'ember';
import ENV from 'bidr/config/environment';
const stringify = JSON.stringify;
const parse = JSON.parse;
function setItem(key, value) {
localStorage.setItem(key, stringify(value));
}
function getItem(key) {
var result = localStorage.getItem(key);
if (result) {
return parse(result);
}
}
export default Ember.Service.extend({
namespace: ENV.APP.LocalStorageKey,
user: null,
init: function() {
this.set('user',this.getItem('user'));
},
setItem: function (key, object) {
var ttlOptions = arguments[2];
if (ttlOptions) {
this._setTTLKey(key, ttlOptions);
}
this.set(key,object);
setItem(this._namespacedKey(key), object);
},
getItem: function (key) {
return getItem(this._namespacedKey(key));
},
keyExpired: function (key, now) {
var ttl = this.getItem(`_ttl_${key}`);
if (ttl) {
var expiry = new Date(ttl.lastUpdated)
.setTime(new Date(ttl.lastUpdated)
.getTime() + ttl.ttl);
now = now || new Date();
return now > expiry;
}
return true;
},
_setTTLKey: function (key, ttlOptions) {
var dateTime = new Date();
setItem(this._namespacedKey(`_ttl_${key}`),
{ttl: ttlOptions.ttl, lastUpdated: dateTime}
);
},
_namespacedKey: function (key) {
return this.get('namespace') + `.${key}`;
}
});
ユーザー オブジェクトは、テンプレート内で、または計算されたプロパティ値として直接アクセスできるようにするためのものです。
問題は、サービス内のプロパティに依存する別の計算されたプロパティuser
が変更されたときに通知されないことです。私のアプリケーションコントローラーにはuser
、サービス内のプロパティのプロパティを更新するアクションがあります
updateActiveEvent(eventInfo) {
var currentUserInfo = this.get('localStorage').getItem('user');
currentUserInfo.active_auction = eventInfo.eid;
this.get('localStorage').setItem('user',currentUserInfo);
},
(これはソケット サービスから取得されます) このアクションが起動した後、ブラウザの localstorage オブジェクトをチェックして、そのactive_auction
プロパティが変更されたことを確認できるため、これは適切に機能しています。しかし、それを表示しているテンプレート(またはそれに基づいて計算されたプロパティ)では、更新されていません。
ember にプロパティの変更を強制的に通知させる方法がある可能性があることを確認しましたが、これを機能させることができなかったようです。正しく行っているかどうかはわかりません。