Registry / storage / angular-web-storage

angular-web-storage

library21.0.0jsnpmunverified

Angular decorators and services for automatically saving and restoring component properties to HTML5 LocalStorage and SessionStorage with expiration support. v21.0.0 (latest stable) supports Angular 15+ and is actively maintained with monthly releases. Key differentiators: simple @LocalStorage() and @SessionStorage() decorators, configurable expiration times (seconds to years), and service APIs for manual control. Unlike ngx-webstorage, it offers built-in expiration and type-safe decorators.

storage

npm install angular-web-storage

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · ANGULAR-WEB-STORAG

angular-web-storage

storagejavascriptv21.0.0

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

LocalStorage

✓ import { LocalStorage } from 'angular-web-storage';

✗ import { LocalStorage } from '@angular/common';

Decorator is exported from 'angular-web-storage', not from Angular core.

SessionStorageService

✓ import { SessionStorageService } from 'angular-web-storage';

✗ import { SessionStorageService } from 'angular-web-storage/service';

Direct barrel import from 'angular-web-storage' works for all exports.

LocalStorageService

✓ import { LocalStorageService } from 'angular-web-storage';

✗ const LocalStorageService = require('angular-web-storage').LocalStorageService;

ESM style is recommended; CommonJS may have issues with tree-shaking.

Shows basic setup: import AngularWebStorageModule, use @LocalStorage decorator with optional key, expiration (7 days).

npm install angular-web-storage --save // app.module.ts import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { AngularWebStorageModule } from 'angular-web-storage'; import { AppComponent } from './app.component'; @NgModule({ declarations: [AppComponent], imports: [BrowserModule, AngularWebStorageModule], bootstrap: [AppComponent] }) export class AppModule {} // app.component.ts import { Component } from '@angular/core'; import { LocalStorage } from 'angular-web-storage'; @Component({ selector: 'app-root', template: '<h1>{{ title }}</h1>' }) export class AppComponent { @LocalStorage('title', 7, 'd') title = 'Hello World'; }

Debug

Known issues

breakingVersion 2.x dropped support for Angular <5; upgraded to Angular 18+ requires v21.

fix

Update to angular-web-storage@21 for Angular 15+ compatibility.

affects: >=2.0.0 <3.0.0

deprecatedThe 'expired' parameter in set() method is deprecated; use expiration options instead.

fix

Use set(key, value, { expired: 10, unit: 'h' }) pattern.

affects: >=21.0.0

gotchaDecorator values are only synced to storage during component initialization; changes after that require service methods.

fix

Use LocalStorageService.set() for runtime updates.

affects: all

gotchaExpiration is checked on get(); a stale value may still be in storage but returns null/undefined.

fix

Always handle null returns from get() as expired.

affects: all

gotchaDo not use both @LocalStorage() decorator and LocalStorageService for the same key; behavior is undefined.

fix

Choose one pattern per key.

affects: all

Errors

Common errors & fixes

NullInjectorError: No provider for LocalStorageService!

Forgot to import AngularWebStorageModule in your module.

fix

Add AngularWebStorageModule to imports array in @NgModule.

TypeError: Cannot read properties of null (reading 'getItem')

LocalStorage is not available (e.g., in server-side rendering or private browsing).

fix

Wrap calls in isPlatformBrowser() check from @angular/common.

Property 'LocalStorage' does not exist on type 'typeof import("angular-web-storage")'.

Using an older version without TypeScript definitions or conflicting types.

fix

Update to v21: npm install angular-web-storage@latest.

Upgrade

Version history

21.0.0latest on npm

Audit

Dependencies

@angular/corerequiredPeer dependency required for Angular decorator and injection support

Agent activity

42 hits · last 30 days

node

Resources

githubhttps://github.com/cipchk/angular-web-storage ↗

packageangular-web-storage ↗

homepagehttps://cipchk.github.io/angular-web-storage/ ↗