ngx-warehouse

An offline-first datastore for Angular apps

getting started

  1. First, install ngx-warehouse via npm or yarn.
  2. Next, import the NgxWarehouseModule in your AppModule.
  3. Finally, add the NgxWarehouseModule to your AppModule imports.
            $ npm install --save ngx-warehouse
          
or
            $ yarn add ngx-warehouse
          
            
import { NgxWarehouseModule } from 'ngx-warehouse';
            
          
            
@NgModule({
  declarations: [...],
  imports: [
    ...
    NgxWarehouseModule,
    ...
  ],
  bootstrap: [...]
})
            
          

configuration

ngx-warehouse comes with a default configuration to get up and running quickly. However, if you'd like to customize the options, it's easy to do so.

  1. Along with the NgxWarehouseModule, import WarehouseConfig and DRIVER_TYPE.
  2. Define a config object of type WarehouseConfig.
    The following DRIVER_TYPE's are available:
    • DEFAULT - The warehouse will first try to connect to IndexedDB, then WebSQL, and finally LocalStorage if the first two fail.
    • INDEXEDDB - Force the connection to IndexedDB.
    • WEBSQL - Force the connection to WebSQL.
    • LOCALSTORAGE - Force the connection to LocalStorage.
  3. Pass the config object to the NgxWarehouseModule using the configureWarehouse() function.
            
import { NgxWarehouseModule, WarehouseConfig, DRIVER_TYPE } from 'ngx-warehouse';

const config: WarehouseConfig = {
  driver: DRIVER_TYPE.DEFAULT,
  name: 'Your App',
  version: 1.0,
  storeName: 'key_value_pairs', // Should be alphanumeric, with underscores.
  description: 'A description of your app'
};

@NgModule({
  declarations: [...],
  imports: [
    ...
    NgxWarehouseModule.configureWarehouse(config),
    ...
  ],
  bootstrap: [...]
})
            
          

usage

Now you're ready to use ngx-warehouse in your app.

            
import { Warehouse } from 'ngx-warehouse';

@Component({
  ...
})
export class MyComponent implements OnInit {

  constructor(public warehouse: Warehouse) { }

  ngOnInit() {
    this.warehouse.get('key').subscribe(
      data => console.log(data),
      error => console.log(error)
    );
  }

}
            
          

set(key: string, value: any): Observable < any >

Saves an item to the current offline data store. The following data types are valid:

            
Warehouse.set('key', value).subscribe(
  (item) => {
    // do something with newly saved item
  },
  (error) => {
    // handle the error
  }
);