Ionic Data Storage – For MovieList

Not working

In ionic we can persist data across different sessions of the app using the following approaches:
1. Local Storage
2. SQLite database

We will use local storage plugin, in HTML the local storage had to introduce to overcome some of the limitation of browser cookies.Not all the browser support the local storage.

Step to follow:

Step 1: We will configure the first configure the setting the movie items to and retrieving movie items fromNativeStorage.

ionic start moviesApp blank --v2
cd moviesApp
npm install
ionic platform add android
ionic cordova plugin add cordova-plugin-nativestorage
npm install --save @ionic-native/native-storage
ionic g provider localStorage

First, we will add code for providers/local-storage.ts service 

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import { NativeStorage } from '@ionic-native/native-storage';
import 'rxjs/add/operator/map';

@Injectable()
export class LocalStorage {
  private storedData : any;
  
  constructor(public http: Http, private nativeStorage: NativeStorage) {
    console.log('Hello LocalStorage Provider');
  }

 setItem(itemName, itemValue) : any{
    return new Promise(resolve => {
     this.nativeStorage.setItem(itemName, itemValue)
      .then(
        (data) => {
            resolve(true);
        },
      (error) => {
        console.log("Fail to set storage key value");
      });
   });
}

getItems(itemKey){
    return new Promise(resolve => {
     this.nativeStorage.getItem(itemKey)
      .then(
         (data) => {
          this.storedData = JSON.parse(data);
            resolve(this.storedData);
         },
        (error) => {
           console.log("We don’t get data!");
        })
      });
 }
}

We are implementing to methods setItem and getItem are our own wrapper method around the NativeStorage API methods which themselves are contained within Promises that
return the results of the NativeStorage API method that is being executed.

In the app/app.module.ts, add the following line of code

import { LocalStorage } from '../providers/local-storage';
..
..
providers: [{provide: ErrorHandler, useClass: IonicErrorHandler}, LocalStorage]