https://github.com/cipchk/angular-web-storage
Angular decorator to save and restore of HTML5 Local&Session Storage
https://github.com/cipchk/angular-web-storage
Last synced: 4 months ago
JSON representation
Angular decorator to save and restore of HTML5 Local&Session Storage
- Host: GitHub
- URL: https://github.com/cipchk/angular-web-storage
- Owner: cipchk
- License: mit
- Created: 2017-06-09T10:39:12.000Z (about 8 years ago)
- Default Branch: master
- Last Pushed: 2024-11-24T05:52:07.000Z (7 months ago)
- Last Synced: 2025-02-05T18:44:29.204Z (4 months ago)
- Language: HTML
- Homepage: https://cipchk.github.io/angular-web-storage/
- Size: 5.27 MB
- Stars: 35
- Watchers: 6
- Forks: 7
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- trackawesomelist - angular-web-storage (⭐36) - Angular decorator to save and restore of HTML5 Local & Session Storage. (Recently Updated / [Mar 14, 2025](/content/2025/03/14/README.md))
- fucking-awesome-angular - angular-web-storage - Angular decorator to save and restore of HTML5 Local & Session Storage. (Table of contents / Third Party Components)
- awesome-angular - angular-web-storage - Angular decorator to save and restore of HTML5 Local & Session Storage. (Table of contents / Third Party Components)
README
# angular-web-storage
Angular decorator to save and restore of HTML5 Local&Session Storage
[](https://www.npmjs.com/package/angular-web-storage)
## 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)