Javascript 使用 LocalStorage 离子 2

using LocalStorage ionic 2

提问by bhatman

I have two text fields and have to take data from both of them and store it using LocalStorage. So here is the code I've implemented but it's not working can you tell me to solve it.

我有两个文本字段，必须从它们两个中获取数据并使用 LocalStorage 存储它。所以这是我实现的代码，但它不起作用你能告诉我解决它吗。

in page1.html

在 page1.html 中

<ion-input [(ngModel)]="hour" type="number"  ></ion-input>

 <ion-input [(ngModel)]="min" type="number" ></ion-input>

<button clear (click)="setTime(hours.value,min.value)" item-right >settime</button>

in pag1.ts

在 pag1.ts

export class Page1 {

   public hour;
   public min;
   public local:Storage; 

  constructor(public nav: NavController, translate:TranslateService) {}


 setTime(hour, min){

   if(hour<24 && hour>0 && min>0 && min<61){
       this.local.set('hour',JSON.stringify(hour));
       this.local.set('min',JSON.stringify(min));
   }
   else{
     console.log("OUTOF LIMIT TIME EXCEPTION the values are "+hour+min);
   }
 }

  }

on console log, it is showing [Object Object]at the end

在控制台日志上，它显示 [Object Object]在最后

and please also tell about getfrom localStorage. Thanks in advance :-)

并请告知 从 localStorage获取。提前致谢 ：-）

回答by Tomas Marik

The previous answer is obsolete, here is an UPDATE.

以前的答案已过时，这里是更新。

Follow these steps:

按着这些次序：

1. Install Storage Module

   $ cordova plugin add cordova-sqlite-storage --save
   $ npm install --save @ionic/storage
   

2. Add storage into app.module.ts

   import { Storage } from '@ionic/storage';
   
   @NgModule({
   
      ...
   
      providers: [
        Storage
      ]
    })
   export class AppModule {}
   

3. Use it :)

   import { Storage } from '@ionic/storage';
   
   export class MyApp {
       constructor(storage: Storage) {
   
       // set        key   value
       storage.set('myKey', 'myVal');
   
       // get value 
       storage.get('myKey').then((val) => {
         console.log(val);
       })
    }
   }
   

1. 安装存储模块

   $ cordova plugin add cordova-sqlite-storage --save
   $ npm install --save @ionic/storage
   

2. 将存储添加到 app.module.ts

   import { Storage } from '@ionic/storage';
   
   @NgModule({
   
      ...
   
      providers: [
        Storage
      ]
    })
   export class AppModule {}
   

3. 用它 ：）

   import { Storage } from '@ionic/storage';
   
   export class MyApp {
       constructor(storage: Storage) {
   
       // set        key   value
       storage.set('myKey', 'myVal');
   
       // get value 
       storage.get('myKey').then((val) => {
         console.log(val);
       })
    }
   }
   

find more on http://ionicframework.com/docs/v2/storage/

在http://ionicframework.com/docs/v2/storage/上找到更多信息

回答by Manu Valdés

You need to import both Storageand LocalStorage, and you need to add this to your constructor:

您需要同时导入Storageand LocalStorage，并且需要将其添加到您的构造函数中：

this.local = new Storage(LocalStorage);

Docs with and example are here: http://ionicframework.com/docs/storage/

文档和示例在这里：http: //ionicframework.com/docs/storage/

回答by Francis Benyah

Actually you need to wait for storage to be ready as well

实际上，您还需要等待存储准备就绪

So as stated before install it

所以如安装前所述

if you intend to use sqlite do this first

如果您打算使用 sqlite，请先执行此操作

$ cordova plugin add cordova-sqlite-storage --save

if not skip it and proceed to do

如果不跳过它并继续做

$ npm install --save @ionic/storage

Next add it to the providers list in your NgModule

接下来将其添加到 NgModule 中的提供者列表中

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

@NgModule({

 ...

 providers: [
  Storage
 ]
})
export class AppModule {}

Then you can proceed to inject it where needed

然后你可以继续在需要的地方注入它

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

export class MyApp {
constructor(storage: Storage) {

    storage.ready().then(() => {
         // set key   value
         storage.set('myKey', 'myVal');

         // get value 
         storage.get('myKey').then((val) => {
           console.log(val);
         })
    });
  }
}