Невозможно разрешить все параметры для хранилища: (?)

Я получаю значения от модального, и я хочу сохранить и получить его с помощью локального хранилища в проекте 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 {}

Ответы

Ответ 1

От @ionic/storage version - 2.0.0, выполните следующие изменения:

app.module.ts

import { IonicStorageModule } from '@ionic/storage';

//..
@ngModule({

imports: [
  IonicModule.forRoot(MyApp),
  HttpModule,
  IonicStorageModule.forRoot(),
]

Примечание: вам нужно удалить import { Storage } from '@ionic/storage';

Ознакомьтесь с примечаниями к выпуску здесь

Ответ 2

Я столкнулся с одной и той же проблемой, следуя этой прохладной игре. Если вы решите следовать требованиям, убедитесь, что вы установили плагины cordova, перечисленные в начале видео:

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

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

и вот как вы разрешите ошибку:

В Ионном 3...

Из приведенного ниже URL:

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

Во-первых, если вы хотите использовать SQLite, установите плагин cordova-sqlite-storage:

ionic cordova plugin add cordova-sqlite-storage

Затем установите пакет (поставляется по умолчанию для Ionic apps > Ionic V1):

npm install --save @ionic/storage

Затем добавьте его в список импорта в своем объявлении NgModule (например, в 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 {}

Наконец, добавьте его в любой из ваших компонентов или страниц:

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);
  });
}

Ответ 3

Вам нужно переместить код, в котором вы получаете доступ к значениям из разрешенного обещания, в .then() этого обещания. Поскольку это будет асинхронная операция, к моменту ее использования она может быть недоступна.

например. это может сработать:

presentModal() {
    this.storage.get('distUnit').then((val) => {
        console.log('Your distUnit is', val);
        this.DistanceUnit = val;
        this.storage.get('SetRadious').then((val) => {
            console.log('Your SetRadious is', val);
            this.selectedRadious = val;

            this.modalCreator();
        })
        .catch(err=>{
            console.log('Your SetRadious dont exist: ' + JSON.stringify(err));
            this.selectedRadious = 500;
            this.modalCreator();
        });
    })
    .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;

            this.modalCreator();
        })
        .catch(err=>{
            console.log('Your SetRadious dont exist: ' + JSON.stringify(err));
            this.selectedRadious = 500;
            this.modalCreator();
        });
    });
}

modalCreator(){
    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();
}

Если вы внимательно прочитаете код, вы узнаете, что я обработал все случаи для получения обоих параметров, и если один из них вышел из строя. Проверьте это и сообщите мне.

Ответ 4

У меня была эта проблема. Во-первых, вы должны увидеть это обновление.

В основном вам необходимо:

  • Удалите Storage из providers в app.module.ts
  • import { IonicStorageModule } from '@ionic/storage' вместо import { IonicStorage } from '@ionic/storage' в app.module.ts
  • Добавить IonicStorageModule.forRoot() в массив imports в app.module.ts

После этого, однако, у меня все еще была ошибка (не удается разрешить все параметры для Storage: (?)). Я узнал, что использовал Storage в качестве поставщика в компоненте. Вам нужно удалить его. См. Ниже:

@Component({
  selector: 'login',
  templateUrl: 'login.component.html',
  providers: [
    AuthService,
    // Storage, <-- you need to remove this
    JwtHelper
  ]
})

Ответ 5

В дополнение к ответу Suraj я обнаружил, что мне нужно явно создать объект Storage в конструкторе, передавая параметры, например.

	this.storage=new Storage({name:"__mydb"});

Ответ 6

Ответ от suraj привел к решающему решению.

У меня была та же проблема. В app.module.ts я указал оба параметра: import {IonicStorageModule} from '@ionic/storage'; и: import {Storage} from '@ionic/storage'. Когда я не смог решить проблему, я установил: npm install @ionic/storage. Я удалил: import {Storage} from '@ionic/storage' из app.module.ts и оставил только это: import {IonicStorageModule} from '@ionic/storage'; После этого проблема была исправлена.