Ionic 4 проблема с хранилищем: нет поставщика для хранилища - PullRequest
Новая
       14

Ionic 4 проблема с хранилищем: нет поставщика для хранилища

1 голос
/ 09 мая 2019

Я пытаюсь импортировать модуль хранения в мой ионный проект.но когда я добавляю провайдеров Storage, ошибка меняется.Ошибка становится «не удалось решить сохранить все: (?)» Как я могу решить эту ошибку?не могли бы вы мне помочь, пожалуйста?Я написал свои коды ниже.Я смотрю это видео: https://www.youtube.com/watch?v=h_IhS8QQjUA&list=PLNFwX8PVq5q7S-p_7zO99xdauhDsnMPw0&index=17&t=0s

Модуль приложения ts: 

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouteReuseStrategy } from '@angular/router';

import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';
import {Storage} from '@ionic/storage';

import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';
import { IonicStorageModule  } from '@ionic/storage';
@NgModule({
  declarations: [AppComponent],
  entryComponents: [],
  imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule,IonicStorageModule.forRoot()],
  providers: [
    StatusBar,
    SplashScreen,
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}

Страница TS 

import { Component, ViewChild } from "@angular/core";
import { StorageService, Item } from "../services/storage.service";
import { Platform, ToastController, IonList } from "@ionic/angular";
@Component({
  selector: "app-home",
  templateUrl: "home.page.html",
  styleUrls: ["home.page.scss"]
})
export class HomePage {
  items: Item[] = [];
  newItem: Item = <Item>{};
  @ViewChild("mylist") mylist: IonList;

  constructor(
    private storageService: StorageService,
    private plt: Platform,
    private toastController: ToastController
  ) {
    this.plt.ready().then(() => {
      this.loadItems();
    });
  }

  loadItems() {
    this.storageService.getItems().then(items => {
      this.items = items;
    });
  }

  addItem() {
    this.newItem.modified = Date.now();
    this.newItem.id = Date.now();

    this.storageService.addItem(this.newItem).then(item => {
      this.newItem = <Item>{};
      this.showToast("Item Added");
      this.loadItems();
    });
  }

  updateItem(item:Item){
    item.title='UPDATED:${item.title}';
    item.modified=Date.now();
    this.storageService.updateItem(item).then(item=>{
      this.showToast("Item Updated");
      this.loadItems();
    });
  }

  deleteItem(item:Item){
    this.storageService.deleteItem(item.id).then(item=>{
      this.showToast("Item Deleted");
      this.mylist.closeSlidingItems();
      this.loadItems();
    });
  }

  async showToast(msg){
    const toast=await this.toastController.create({
      message:msg,
      duration:2000
    });
    toast.present();
  }
}

Служба 

import { Injectable } from '@angular/core';

export interface Item{
  id:number,
  title:string,
  value:string,
  modified:number
}
const ITEMS_KEY="my-items";
@Injectable({
  providedIn: 'root'
})
export class StorageService {

  constructor(private storage:Storage) { }

  addItem(item:Item):Promise<any>{
    return this.storage.get(ITEMS_KEY).then((items:Item[])=>{
      if(items){
        items.push(item);
        return this.storage.set(ITEMS_KEY,items);
      }else{
        return this.storage.set(ITEMS_KEY,[item]);
      }
    });
  }
  getItems():Promise<Item[]>{
    return this.storage.get(ITEMS_KEY);
  }
  getItem(id:number){

  }
  updateItem(item:Item):Promise<any>{
    return this.storage.get(ITEMS_KEY).then((items:Item[])=>{
      if(!items || items.length==0){

        return null;
      }

      let newItems:Item[]=[];
      for (let i of items){
        if(i.id==item.id){
          newItems.push(item);
        }else{
            newItems.push(i);
        }
      }
      return this.storage.set(ITEMS_KEY,newItems);
    });
  }

  deleteItem(id:number):Promise<Item>{
    return this.storage.get(ITEMS_KEY).then((items:Item[])=>{
      if(!items || items.length==0){

        return null;
      }

      let toKeep:Item[]=[];
      for (let i of items){
        if(i.id!=id){
          toKeep.push(i);
        }else{
            //newItems.push(i);
        }
      }

      return this.storage.set(ITEMS_KEY,toKeep);
    });
  }
}

1 Ответ

0 голосов
/ 10 мая 2019

В файле StorageService вы вводите storage следующим образом:

constructor(private storage: Storage) { }

но я не вижу Storage, импортируемого в этот файл. Таким образом, класс Storage, введенный в конструктор, ссылается на API веб-хранилища , а не на хранилище Ionic.

Чтобы это исправить, импортируйте Storage из @ionic/storage: 

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

// ...

@Injectable({
  providedIn: 'root'
})
export class StorageService {

  constructor(private storage: Storage) { }

  // ...

}
...