How do I subscribe to the setItems$ Observable in angular-2-local-storage

Question

I'm using angular-2-local-storage which has an observable of setItems$ that I'm trying to... Observe, with the following code in a directive:

/** app-theme.directive.ts **/

import { Directive, ElementRef, Input } from '@angular/core';
import { UserSettings } from './core/user-settings';
import { LocalStorageService } from 'angular-2-local-storage';

@Directive({
  selector: '[appTheme]'
})
export class AppThemeDirective {
  constructor(el: ElementRef, localStorageService: LocalStorageService) {
    localStorageService.setItems$.subscribe(function(x: any) {
      console.log('subscribed', x);
    });
  }

}

The local storage is updating and persisting well enough in my code, but the updates are not being observed and logging to the console. Any obvious gotcha I missed?

Answer 1

Apologies, it was going fine but I needed to read this: https://github.com/phenomnomnominal/angular-2-local-storage/issues/31 and add the notifyOptions to the app.module.ts imports

LocalStorageModule.withConfig({
    prefix: 'ng-starter',
    storageType: 'localStorage',
    notifyOptions : {setItem: true, removeItem:true}
}),

Answer 2

localStorage and sessionStorage already there in lib, so you can directly use the same using localStorage.setItem() and localStorage.getItem().

mycomponent.ts

import { Directive, ElementRef, Input } from '@angular/core';
import { UserSettings } from './core/user-settings';
import { LocalStorageService } from 'angular-2-local-storage';

@Directive({
  selector: '[appTheme]'
})
export class AppThemeDirective {
  constructor(el: ElementRef, localStorageService: LocalStorageService) {

    let data = { application: this.application };
    localStorage.setItem('applicationdata', JSON.stringify(data));
    var data = localStorage.getItem('applicationdata');
  }

}

Hope this will help you.