# angular-web-storage

> Angular decorator to save and restore of HTML5 Local&Session Storage

Latest version **22.0.0** (published 2026-08-15) · MIT license · 0 weekly downloads

## Install

```sh
npm install angular-web-storage
pnpm add angular-web-storage
yarn add angular-web-storage
bun add angular-web-storage
```

## Health

**Score 65/100 (B)** — status: active.

Positive: has types; esm support; no vulnerabilities; recently updated; high maintenance score.

Warnings: low downloads.

## Facts

| | |
|---|---|
| Version | 22.0.0 |
| Published | 2026-08-15 |
| First published | 2017-06-09 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM |
| Dependencies | 1 |
| Unpacked size | 24.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 37 |
| Author | cipchk |
| Maintainers | cipchk |

## Links

- npm: https://www.npmjs.com/package/angular-web-storage
- Repository: https://github.com/cipchk/angular-web-storage
- Homepage: https://cipchk.github.io/angular-web-storage/
- Issues: https://github.com/cipchk/angular-web-storage/issues
- npm.io page: https://npm.io/package/angular-web-storage

## Dependencies (1)

- [tslib](https://npm.io/package/tslib.md) ^2.3.0

## Recent versions

- 22.0.0 (latest) — 2026-08-15
- 17.0.0-rc.0 (next) — 2023-11-02
- 21.0.0 — 2025-11-26
- 20.0.0 — 2025-06-08
- 19.0.0 — 2024-11-24
- 18.0.0 — 2024-06-15
- 17.0.0 — 2023-11-09
- 16.0.0 — 2023-06-04
- 15.0.0 — 2023-01-02
- 14.0.0 — 2022-06-24
- 13.0.0 — 2021-12-28
- 12.0.0 — 2021-05-27
- 10.0.0 — 2020-06-28
- 9.0.0 — 2020-03-25
- 9.0.0-rc.1 — 2020-03-25
- … 9 more at https://npm.io/package/angular-web-storage/versions

## README

# angular-web-storage

Angular decorator to save and restore of HTML5 Local&Session Storage

[![NPM version](https://img.shields.io/npm/v/angular-web-storage.svg)](https://www.npmjs.com/package/angular-web-storage)
![Ci](https://github.com/cipchk/angular-web-storage/workflows/Ci/badge.svg)

## Demo

- [Live Demo](https://cipchk.github.io/angular-web-storage/)
- [Stackblitz](https://stackblitz.com/edit/angular-web-storage)

### 1、Usage

install `angular-web-storage` from `npm`

```bash
npm install angular-web-storage --save
```

### 2、Examples

1. using `LocalStorage` or `SessionStorage` decorator.

```typescript
import { Component } from '@angular/core';
import { LocalStorageService, SessionStorageService, LocalStorage, SessionStorage } from 'angular-web-storage';

@Component({
  selector: 'demo',
  templateUrl: './demo.component.html'
})
export class DemoComponent {
  @LocalStorage() localValue: Object = { text: `Hello ${+new Date()}` };
  // 设置存储KEY，以及10个小时后过期
  @LocalStorage('newKey', 10, 'h') localValue2: Object = { text: `Hello ${+new Date()}` };
  @SessionStorage() sessionValue: string = `Hello ${+new Date()}`;
}
```

2. using `LocalStorageService` or `SessionStorageService` service.

```typescript
import { Component } from '@angular/core';
import { LocalStorageService, SessionStorageService, LocalStorage, SessionStorage } from 'angular-web-storage';

@Component({
  selector: 'demo',
  templateUrl: './demo.component.html'
})
export class DemoComponent {
  constructor(
    private local: LocalStorageService,
    private session: SessionStorageService
  ) {}

  KEY = 'value';
  value: any = null;

  set(expired: number = 0) {
    this.local.set(this.KEY, { a: 1, now: +new Date() }, expired, 's');
  }

  remove() {
    this.local.remove(this.KEY);
  }

  get() {
    this.value = this.local.get(this.KEY);
  }

  clear() {
    this.local.clear();
  }
}
```

### Expired Time Unit

- `s` Second.
- `m` Minute.
- `h` Hour.
- `d` Day.
- `w` Week(equar 7 Day).
- `y` Year.
- `t` Custom(unit: millisecond).

## Troubleshooting

Please follow this guidelines when reporting bugs and feature requests:

1. Use [GitHub Issues](https://github.com/cipchk/angular-web-storage/issues) board to report bugs and feature requests (not our email address)
2. Please **always** write steps to reproduce the error. That way we can focus on fixing the bug, not scratching our heads trying to reproduce it.

Thanks for understanding!

### License

The MIT License (see the [LICENSE](https://github.com/cipchk/angular-web-storage/blob/master/LICENSE) file for the full text)

---
_Source: https://npm.io/package/angular-web-storage · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._