@ngxs-labs/async-storage-plugin
    TypeScript icon, indicating that this package has built-in type declarations

    0.1.1 • Public • Published


    Supports custom storage engine with async access

    NPM License

    📦 Install

    To install @ngxs-labs/async-storage-plugin run the following command:

    npm install --save @ngxs-labs/async-storage-plugin
    # or if you use yarn
    yarn add @ngxs-labs/async-storage-plugin

    🔨 Usage

    Import the module into your root application module:

    import { NgModule } from '@angular/core';
    import { NgxsModule } from '@ngxs/store';
    import { NgxsAsyncStoragePluginModule } from '@ngxs-labs/async-storage-plugin';
     
    @NgModule({
        imports: [
            NgxsModule.forRoot(states),
            NgxsAsyncStoragePluginModule.forRoot(YOUR_CUSTOM_ENGINE)
        ]
    })
    export class AppModule {}

    Custom Async Storage Engine

    You can implement your own async storage engine by providing an engine that implements AsyncStorageEngine:

    export class MyAsyncStorageEngine implements AsyncStorageEngine {
      constructor(private storage: YourStorage) { }
     
      length(): Observable<number> {
        // Your logic here
      }
     
      getItem(key: any): Observable<any> {
        // Your logic here
      }
     
      setItem(key: any, val: any): void {
        // Your logic here
      }
     
      removeItem(key: any): void {
        // Your logic here
      }
     
      clear(): void {
        // Your logic here
      }
     
      key(val: number): Observable<string> {
        // Your logic here
      }
     
    }
     
    @NgModule({
      imports: [
        NgxsModule.forRoot([]),
        NgxsAsyncStoragePluginModule.forRoot(MyAsyncStorageEngine)
      ]
    })
    export class AppModule {}

    If your async storage returns a Promise you can wrap calls with from(storage.length()) from rxjs.

    Code Samples

    Custom Ionic Storage Engine

    Here is an example implementation of the AsyncStorageEngine using the Ionic Storage. You can find the StorageService in the integration project.

    import { Injectable, NgModule } from '@angular/core';
    import { IonicStorageModule, Storage } from '@ionic/storage';
    import { AsyncStorageEngine, NgxsAsyncStoragePluginModule } from '@ngxs-labs/async-storage-plugin';
    import { NgxsModule } from '@ngxs/store';
    import { from, Observable } from 'rxjs';
     
    @Injectable({
      providedIn: 'root'
    })
    export class StorageService implements AsyncStorageEngine {
      constructor(private storage: Storage) { }
     
      length(): Observable<number> {
        return from(this.storage.length());
      }
     
      getItem(key: any): Observable<any> {
        return from(this.storage.get(key));
      }
     
      setItem(key: any, val: any): void {
        this.storage.set(key, val);
      }
     
      removeItem(key: any): void {
        this.storage.remove(key);
      }
     
      clear(): void {
        this.storage.clear();
      }
     
      key(val: number): Observable<string> {
        return from(this.storage.keys().then(keys => keys[val]));
      }
     
    }
     
    @NgModule({
      imports: [
        NgxsModule.forRoot([]),
        NgxsAsyncStoragePluginModule.forRoot(StorageService),
        IonicStorageModule.forRoot()
      ]
    })
    export class AppModule {}

    Options and Migrations

    This plugin provides the same options and migration settings as the Storage Plugin. See Options and Migrations here.

    Keywords

    none

    Install

    npm i @ngxs-labs/async-storage-plugin

    DownloadsWeekly Downloads

    379

    Version

    0.1.1

    License

    MIT

    Unpacked Size

    234 kB

    Total Files

    37

    Last publish

    Collaborators

    • janmalch
    • duffleit
    • joaqcid
    • marcjulian
    • markwhitfeld
    • overthesanity
    • amcdnl
    • splincode