How to save data in Ionic Framework

In most of the cases when you develop mobile application, you need to save some data in your local storage. Same is true for Android native app or iOS native app or even hybrid cordova app development. Today I’ll show you, how to save data in Ionic Framework in local storage.

It will take about 15 minutes to complete the project. After finishing the project you will be able to save and get both Json Object and plain string data from local storage.

Create a new application :

Move to your application’s root folder and add native storage cordova plugin:

Make it available in your app.module.ts file:

Create a new provider:

Open the provider and add following code:

Above provider can save and fetch both json object and primitive data types.

Create a new page named home:

Don’t forget to add page-name (home) in declarations and entryComponents arrays in app.module.ts file; Add it as root page in app.component.ts file.

Now go to your Home page (home.ts) and inject the storage dao through constructor

Now let’s save and get strings in your constructor.  For simplicity, we’ll just output the result in console.

Save String

Get String

Save Object:

Get Object:

You can remove a single key value:

Or delete all data from your application:

Now save and run the app to see the result.

Leave a Reply