Can't resolve all parameters for Storage: (?)

Question

I am getting values from a modal and I want to store and get it using local storage in ionic2 angular2 project. My code is given below. It gives following error:

In home.ts page, I have imported storage

import { Storage } from '@ionic/storage';  @Component({   selector: 'page-home',   templateUrl: 'home.html',   providers :[   Storage ] })  export class HomePage {  private DistanceUnit: string;  private selectedRadious : number;   constructor(public navCtrl: NavController           public modalCtrl: ModalController,           public storage: Storage) {   }  presentModal() { this.storage.get('distUnit').then((val) => {   console.log('Your distUnit is', val);   this.DistanceUnit = val;      }) .catch(err=>{   console.log('Your distUnit dont exist: ' + JSON.stringify(err));   this.DistanceUnit = 'Meters'; });   this.storage.get('SetRadious').then((val) => {   console.log('Your SetRadious is', val);   this.selectedRadious = val; })  .catch(err=>{   console.log('Your SetRadious dont exist: ' + JSON.stringify(err));     this.selectedRadious = 500; });   let obj = {selectedRadious: this.selectedRadious, DistanceUnit: this.DistanceUnit}; let myModal = this.modalCtrl.create(SettingModalPage, obj);  myModal.onDidDismiss(data => {   console.log('modal value: '+data.DistanceUnit)   this.DistanceUnit = data.DistanceUnit;   this.selectedRadious = data.selectedRadious;   this.storage.set('distUnit', this.DistanceUnit);  this.storage.set('SetRadious', this.selectedRadious); });  myModal.present(); } } 

In app.module.ts file,

import { NgModule, ErrorHandler } from '@angular/core'; import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular'; import { HttpModule } from '@angular/http'; import { Storage } from '@ionic/storage'; import { MyApp } from './app.component'; import { HomePage } from '../pages/home/home'; import { DetailsPage } from '../pages/details/details';  import { StatusBar } from '@ionic-native/status-bar'; import { SplashScreen } from '@ionic-native/splash-screen'; import { TypeApi } from '../shared/shared'; import { PlaceDetailService } from '../shared/shared'; import { LaunchNavigator, LaunchNavigatorOptions } from '@ionic- native/launch-navigator'; import { SettingModalPage } from '../pages/setting-modal/setting-modal';  @NgModule({   declarations: [   MyApp,   HomePage,   DetailsPage,   SettingModalPage  ], imports: [   IonicModule.forRoot(MyApp),   HttpModule ], bootstrap: [IonicApp],   entryComponents: [   MyApp,   HomePage,   DetailsPage,   SettingModalPage ], providers: [   Storage,   TypeApi,   PlaceDetailService,   LaunchNavigator,   StatusBar,   SplashScreen,   {provide: ErrorHandler, useClass: IonicErrorHandler} ] }) export class AppModule {} 

Answer 1

From @ionic/storage version - 2.0.0, make the below changes:

app.module.ts

import { IonicStorageModule } from '@ionic/storage';  //.. @ngModule({  imports: [   IonicModule.forRoot(MyApp),   HttpModule,   IonicStorageModule.forRoot(), ] 

Note: you need to remove import { Storage } from '@ionic/storage';

Check release notes here

Answer 2

I encountered the same problem whilst following this cool tut. If should you choose to follow the tut, make sure you have installed the cordova plugins listed at the beginning of the video:

https://www.youtube.com/watch?v=Cnj9fQCyflY

http://technotip.com/5171/ionic-storage-ionic-2/

and this is how you resolve the error:

In Ionic 3...

From the below url:

https://ionicframework.com/docs/storage/

First, if you'd like to use SQLite, install the cordova-sqlite-storage plugin:

ionic cordova plugin add cordova-sqlite-storage 

Next, install the package (comes by default for Ionic apps > Ionic V1):

npm install --save @ionic/storage 

Next, add it to the imports list in your NgModule declaration (for example, in src/app/app.module.ts):

import { IonicStorageModule } from '@ionic/storage';  @NgModule({   declarations: [     // ...   ],   imports: [           BrowserModule,     IonicModule.forRoot(MyApp),     IonicStorageModule.forRoot()   ],   bootstrap: [IonicApp],   entryComponents: [     // ...   ],   providers: [     // ...   ] }) export class AppModule {} 

Finally, inject it into any of your components or pages:

import { Storage } from '@ionic/storage';  export class MyApp {   constructor(private storage: Storage) { }    ...    // set a key/value   storage.set('name', 'Max');    // Or to get a key/value pair   storage.get('age').then((val) => {     console.log('Your age is', val);   }); }