---

> Supports custom storage engine with async access


📦 Install

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

``console
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:

`typescript
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:

`typescript
export class MyAsyncStorageEngine implements AsyncStorageEngine {
constructor(private storage: YourStorage) { }

length(): Observable {
// Your logic here
}

getItem(key: any): Observable {
// 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 {
// 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

$3


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

`typescript
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 {
return from(this.storage.length());
}

getItem(key: any): Observable {
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 {
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.