Angular - 使用开源项目 LocalStorageService 存取数据

writes at beginning, sometime we need to save data into localStorage and control its life ourselves , and here is a good open source tool helps do this

 

1. for example , get a user form localStorage

 constructor(private localStorageService: LocalStorageService, public  client: HttpClient) {

  }

  getUserFromLocalStorage(): Observable<User | null> {
    const temp = this.localStorageService.get(User.identifier);
    return temp ? of(temp) : of(null);
  }

all you need to attention is the   .get(User.identifier)  method ,  it looks for data in localStorage with given identifier , in this case the valuei is user$ ,  it matters nothing, or you can check the whole definition below

export class User {
  static identifier = 'user$';
  username: string;
  token: Token;
  id: number;

  constructor(username: string, token: Token, id: number) {
    this.username = username;
    this.token = token;
    this.id = id;
  }
}



export class Token {
  public static identifier = 'token$';
  sysUserId: number;
  username: string;
  accessToken: string;

  constructor(sysUserId: number, username: string, accessToken: string) {
    this.sysUserId = sysUserId;
    this.username = username;
    this.accessToken = accessToken;
  }
}

 

2. and save a user to localStorage

 

saveUserToLocalStorage(token?: Token, user?: User) {
    if (token) {
      this.localStorageService.set(User.identifier, new User(token.username, token, token.sysUserId));
      return;
    }
    this.localStorageService.set(User.identifier, user);
  }

 

3. or control with the ttl

import {ExpiredUnit} from 'angular-web-storage/src/util';

export class Address {
  static identifier= 'address$';
  static expiredAt = 1;
  static expiredUnit: ExpiredUnit = 'h';

  ret: number;
  data: Data;
  msg: string;
}
....
saveAddress(address: Address): void {
    this.localStorageService.set(Address.identifier, address, Address.expiredAt, Address.expiredUnit);
  }