Я получаю значения от модального, и я хочу сохранить и получить его с помощью локального хранилища в проекте ionic2 angular2. Мой код приведен ниже. Он дает следующую ошибку:
В home.ts
странице, я импортировал хранилище
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();
}
}
В app.module.ts
файле
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 {}